Hacker News new | past | comments | ask | show | jobs | submit login
This is my in-progress collection of CSS3 buttons. Any ideas for more styles? (ubuwaits.github.com)
106 points by Halienja on Sept 21, 2010 | hide | past | favorite | 18 comments



Thank you for sharing these.

Suggestions: Add hover- and mouse-down styles for all of them. For example "Launch" only has a hover-style, but does not change when you press it. (on Chrome/OSX at least)


Almost all of the buttons have hover and active states now. More refinements will be made shortly.


Looks good. :)


Thanks. Adding hover and active states for all the buttons will happen soon.




The redact one looks like it degrades gracefully in IE8 and 7. I noticed these are all using the <button> tag. Hopefully they look just as good with the <input type='submit'>

Have been looking for a good CSS button for a while that degrades gracefully in IE's, and can be used as a submit tag as well as link, etc. Does anyone have a favorite?


These buttons should look just as good using the input tag. There might be very slight differences in certain browsers, but nothing drastic.


I had written a detailed article about it before - http://blog.anomalyinnovations.com/2010/03/creating-a-realis...

It uses a gradient image but that could easily be replaced with the CSS3 gradient.


I made these buttons a while ago: http://e-tjenesten.org/eksperimenter/knapp/


The 'clarify and 'X' buttons show their corners in Chrome, looks a bit messy.


This is the result of a known bug in Chrome/Win and Chrome/Linux:

http://code.google.com/p/chromium/issues/detail?id=29427


very cool. Might I request some that look like the buttons in Tender? I like the smooth minimalism:

http://tenderapp.com/tour/collect/


You might wanna add Hover, Click affect to this button.


Navigation buttons: Back, Forward, Up, Top, etc.


They don't look too bad in IE8.


They also don't look too bad in the IE9 beta.


nice job!




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: