Slicker Buttons with CSS3 Gradients and SVG (for IE9) Demo

by Darren at Made in the North. I'm a Freelance Web Designer based in Leeds, UK. Hire me.

Yes that's right, beautiful animated CSS3 gradient buttons in your favourite modern browsers. Why they even use SVG gradients so they will look just as slick in IE9 (beta) and Opera 10.5 and above.

NB. Best experienced in Internet Explorer 9 beta, Firefox 4, Safari 4+, Opera 10.5+, Chrome 4+

Link Button Link Button Link Button Link Button Link Button

Why use these buttons?

IE9 and Opera gradient support using SVG.
CSS3 box-shadow highlighting on hover state (where supported).
CSS3 gradients for normal and hover states (where supported).
CSS3 transitions to animate button states (where supported).
Just CSS and SVG. No images used.
Flexible and scalable to accommodate longer labels and resizing.
Progressive enhancement for a better experience in more capable browsers.
They look cool!

If you liked this, why not follow me on twitter or subscribe to my feed for more of the same.