New CSS3 gave web designers ability to fill an element’s background with a linear and radial gradients, which means that you use and see it on Safari, Chrome, and Firefox. But support is complicated, as it may seem at first glance, in most browsers and still non-existent in some.
Of course there are many tools – online wizards to help you create a ready code.
The Ultimate CSS Gradient Generator
This is one of the best online gradient generator. It uses a similar interface to Photoshop and creates cross-browser code which includes IE filters. Because it outputs older Internet Explorer opacity format, even work with IE6. colorzilla.com/gradient-editor
CSS Gradient Generator
This simple tool allows you to create linear gradients by adding colors at any number of stop points. gradients.glrzad.com
CSS3 Please!
This special active web page could be useful because it is the Cross-Browser CSS3 Rule Generator. css3please.com
In CSS3 still gradients can not be combined, nor can set transitions between them, and use more colors is very complicated – you want to consider another option. Some suggest that in certain circumstances instead of CSS3 gradients created with SVG. Currently in 2011, all modern browsers, including mobile, well you are doing with SVG. This graphics format can be created using a lot of interesting tools. In addition to the commercial Adobe Illustrator, we have the free Inkscapeas well as Web-based Raven (from the Aviary) and SVG-Edit.
Most importantly, in the era of the various devices used to surf the Web (like iPad, Galaxt Tab, and smartphones), gradients in SVG format are able to scaling for different screen resolutions (5″, 7″, 10″ and more). This format will operate without problems in Chrome, Firefox (from version 4), Safari, Opera and Internet Explorer 9 (though unfortunately without SVG filters, introduced only in the IE10).