【CSS】グラデーションツール「Ultimate CSS Gradient Generator」
現在、ほぼすべてのブラウザで、CSSでグラデーションが使えます。
画像を使わなくてすむので、SEOで有利、ページ容量を減らす等、色々な利点があります。
ただ、現在ブラウザごとに記述が変わったり、なかなか視覚的にわかりずらいかと思います。
そこで、私もよくつかうこのツール
http://www.colorzilla.com/gradient-editor/
外国のサイトですが、使い方はとてもシンプル
英語がわからなくても大丈夫かと思います。
Illustrator Photoshop などの「グラデーションツール」と似た
仕様になっていますので、一度使われたことがある方はわかりやすいと思います。
簡単な説明をしますと。
1.「Presets」のスライダーで色等を調節
2.「Preview」に色の見本がでます。
3.もし大丈夫なら、「CSS」をコピーして、ご自分のスタイルシートに貼り付けるだけです。
ブラウザのバージョンや種類に対応するように何種類かの記述がありますので 不必要な物は削除するとスッキリします。
画像を使わなくてすむので、SEOで有利、ページ容量を減らす等、色々な利点があります。
ただ、現在ブラウザごとに記述が変わったり、なかなか視覚的にわかりずらいかと思います。
そこで、私もよくつかうこのツール
http://www.colorzilla.com/gradient-editor/
外国のサイトですが、使い方はとてもシンプル
英語がわからなくても大丈夫かと思います。
Illustrator Photoshop などの「グラデーションツール」と似た
仕様になっていますので、一度使われたことがある方はわかりやすいと思います。
簡単な説明をしますと。
1.「Presets」のスライダーで色等を調節
2.「Preview」に色の見本がでます。
3.もし大丈夫なら、「CSS」をコピーして、ご自分のスタイルシートに貼り付けるだけです。
ブラウザのバージョンや種類に対応するように何種類かの記述がありますので 不必要な物は削除するとスッキリします。
著者:poroa | 投稿日:2016年09月16日 | カテゴリ:CSS