I’ve been working with CSS3 gradients a bit lately, and they’re the best thing in CSS since border-radius. It’s just so much easier to add a line of CSS and fiddle with a couple of color hex codes than to mess around in Photoshop until you get the perfect gradient, and then go through the Save for Web dialog before setting it as a background image. They also work well with my preference to design things by playing around in a text editor, rather than mocking things up in Photoshop. (i.e. the 37signals philosophy.)
CSS Gradients also add some additional versatility, in that they can stretch to fill dynamically-sized page elements, unlike tiling background images, which can of course only scale along one axis. (And it just seems to much less hacky than loading up a tiling image for a fairly simple effect. Pixel shims, anyone?)
I had held off using CSS gradients, since they were “a fancy new CSS feature unsupported by a lot of browsers,” until I recently realized that not only did all of the modern browsers support them, but many of the browsers were already supporting them without the vendor prefix. IE support is still iffy, only working properly in IE10, but what does Internet Exploder do right?
If you’re not already using CSS gradients, you should definitely read up on them. There’s a good article over at the venerable CSS-Tricks.
