WEB業界で働く人や興味がある人に役立つ情報サイト“qam（カム）”

投稿者： とみー
カテゴリー： デザイン >WEBデザイン

今回は配色を考える際に、とても便利なツールを紹介したいと思います。
マウス操作で簡単に色々な配色を確認することが出来るツール「Color Supply」の紹介です。

Color Supplyの使い方

「Color Supply」にアクセス

「Color Supply」にアクセスします。

Color Supplyにアクセスするとこのような画面になっています。

Color Supplyの使い方

色相環とカラーパターン

12色の色相環と選択している色に近い色の組み合わせが20パターンあります。

配色の使用例とカラーコード

選択した配色の使用例があり、使用した際のイメージがしやすいです。
カラーコードが書いてあるので、コピペですぐに使用出来て便利です。

ベースカラーの変更方法

マウスで黒丸をクリックします。

「赤色に緑色」だったものが、「緑色に赤色」になります。

配色の変更方法

マウスで黒丸をドラッグします。

マウスでドラッグして直感的にカラーを変更出来ます。

組み合わせの変更方法

矢印をクリックします。

このように組み合わせが変更されます。

まとめ

いかがでしたでしょうか。
直感的に使用することが出来て、配色の使用例も確認できるのですごく重宝すると思います。
カラーコードも書いてあるのでデザイナー・コーダーどちらにもおすすめです。
無料のツールなのでまだ使ったことがない方はぜひ使ってみて下さい。