webkit（Safari3.1以上も含む）ではCSSでbackgroundにグラデーションを適用することができます。OperaではSVGを利用して同じようなことができますが、webkitのCSSの記述は非常に面倒です。
Webkit Surfin’Safari(グラディエントについての記事)
http://webkit.org/blog/175/introducing-css-gradients/
Opera SVG (SVGについての記事)
http://virtuelvis.com/archives/css3/index
http://virtuelvis.com/download/2007/09/kestrel/itunestable/
そこで、Web DirectionsのJohn Allsoppが作成したツールがこれです。
http://westciv.com/gradients/
使い方はいたって簡単
上から『Start』『End』『Stops』ボックスが並んでいる。その中で『Start』と『End』はグラデーション色、Horizontal Position=水平位置、Vertical Position=”垂直位置”をそれぞれ指定することができます。
一番最後の『Stops』は途中で色を追加するものと考えると分かりやすい。色をグラデーションの途中で追加することができる。
今後はradial(放射状)のgradientを実装するとJohnと言っていましたので、後ほど実装されると思います。
