Photoshop風インターフェイスで使いやすいCSSグラデーションのジェネレーター

Photoshop風のインターフェイスを備えた、とっても使いやすいCSSグラデーションを作成するオンラインジェネレーターを紹介します。

サイトのキャプチャ

Ultimate CSS Gradient Generator

生成されるスタイルシートは、moz系(Firefoxなど)、webkit系(Chrome, Safariなど)だけでなく、旧ブラウザやIE用のfilterも生成されます。

生成されたスタイルシートの例

グラデーションには、あらかじめ豊富なプリセットが用意されています。

サイトのキャプチャ

グラデーションのプリセット

グラデーションを作成する際は、Photoshopのグラデーションエディタと同様の操作感覚で行えます。

サイトのキャプチャ

カラー分岐点を複数設置することも可能で、ダブルクリックでカラーピッカーが表示されます。

グラデーションのプレビューとスタイルシートは、右側に表示されます。

top of page

©2017 coliss