CSSのグラデーションが簡単につくれる!Ultimate CSS Gradient Generator

こんにちは。瀬井です。

突然ですが今回は、グラデーション生成ツール
『Ultimate CSS Gradient Generator』のご紹介をしたいと思います。

 

“ Ultimate CSS Gradient Generator”って?

CSSでグラデーションを作る際に“linear-gradient( )”を使ったりすると思うのですが、
細かい調整など結構手間がかかって面倒だ!。。って事ないですか?

そんな時にオススメなのが『Ultimate CSS Gradient Generator』です!

 

どんなことが出来るの?

色相や彩度、透過度、グラデーションがかかる方向を指定できたり、
画像を解析したり、逆にCCSから画像を作ったり・・など

PhotoShopのグラデーションツールのような感じで、直感的に操作出来ます。

使い方は?

基本的な使い方は、パレット部分にポイントを追加・移動して、グラデーションを作ります。
“Presets”から好みに近いグラデーションを選択して微調整をしていっても、もちろんOK!

カラーパレットのポイントは、
上が透過性、下がカラーになっていて、パレットの上下でクリックすると簡単に追加できます。
ポイントは選択して“delete”、または上下にドラックすると削除することができます。


作ったグラデーションは“Preview”に反映されるので確認しながら生成し、
グラデーションができたら“css”をコピーしてそのまま使うという感じで、とっても簡単です!

【Ultimate CSS Gradient Generator】はこちらからダウンロード出来ます ↓↓
http://www.colorzilla.com/gradient-editor/

試しに遊んでみてください!