パソコンと女性

サイト作りに役立つ「色」がわかるツール

ホームページやブログをつくる時に色で悩むことも多いと思います。ここでは配色理論を学べたり、色づくりが便利になるツールを紹介していきます。

1. 色彩センスのいらない配色講座

色の3属性から配色の基本までわかりやすくまとまったスライドです。

2. 色で失敗しない為に〜理論に基づく配色フロー〜

こちらもおすすめのスライド。
サンプルサイトをあげながらより詳しい配色の解説があります。

3. HUE/360

HUE/360は画面上でメインカラーを選ぶと、それに合う色を教えてくれるツールです。

カラーサークルの中から好きなカラーをクリックすると、配色に合わない色が消えるので、残った色から選ぶだけでバランスのいい配色をつくることができます。

ベースとなるカラーサークルの色数や明度を変えることもできます。

HUE/360

4. Ultimate CSS Gradient Generator

昔はWebサイトでグラデーションを使う時は画像でつくっていましたが、今はCSSだけで美しいグラデーションをつくることができます。

CSSでグラデーションをつくるメリットは、データが軽くなるのと色の変更が簡単なこと。

こちらのツールは画面上で好きなグラデーションをつくるだけで、CSSが生成される便利なツールです。

Ultimate CSS Gradient Generator

5. ColorZilla

ブラウザで他のサイトを見ていてこのサイトと同じ色を使いたい!と思ったことはないでしょうか?

ColorZillaはブラウザ上の色をクリックするだけで、その色のカラーコードがわかるChromeやFirefoxの拡張機能です。

ColorZilla