今回は便利なカラーパレットツールを紹介します。

チラシのデザインやWEBサイトの作成、バナーを作るときなどにも配色はデザインを左右する重要な項目です。
筆者自身も好きな色ばかりを選んでしまうと系統が偏ってしまったり、色の親和性を見極めるのに毎日苦労しています。

普段使いしているカラーパレットツールを3つご紹介します。


目次
1. 4色のカラーパレットから選ぶColorDrop
2. 丁度いいグラデーションのCSSをコピー　WebGradients
3. キーカラーを選んでお任せ配色＆便利機能たくさん　colorate

1. 4色のカラーパレットから選ぶ　ColorDrop

サイトはこちら＞＞ ColorDrop

4色のカラーの組み合わせがいくつも並び、お気に入りを見つけることができます。
新着（サイトロゴの隣のNew）を変更すると、人気順（Popular）、ランダム（Random)で見ることが可能です。
各パレットの下に高評価の数（ハート）も見ることができるので、何個かお気に入りの配色を選んで評価の数でも選別することができるので便利です。

ビビットで目を引く配色が多いので、配色選びに行き詰まったり一新したいときによく使います。

2. 丁度いいグラデーションのCSSをコピー　WebGradients

サイトはこちら＞＞ WebGradients

個人の感想ですが、「きれいでちょうどいい」グラデーションがたくさん掲載されています。
よいと思ったグラデーションは各カラーの右上にある”↓”のボタンからPNGデータとしてダウンロードしたり、そのままWEBページに採用するのであればカラー右下のCopy CSSをクリックするとコピーができます。任意の場所でペーストすると同グラデーションを表示するためのCSSが表示されます。

グラデーションを作るときにはまず利用するサイトです。

3. キーカラーを選んでお任せ配色＆便利機能たくさん　colorate

サイトはこちら＞＞ colorate

すでにイメージ色が1色決まっているので相性の良い色が知りたい、自分のイメージにぴったりの1色を探したい、背景色にした時の文字の見え方を考えたい、など配色の構想に必要な要素をかなり網羅してくれる便利なサイトです。

使いたい1色のカラーコードが決まっている時は、TOPページ真ん中の「ほかの色でも試してみましょう」の右側にカラーコード入力欄があるので、そこにコードを入れて検索すると配色のイメージや配色の例を見ることができます。
また近似色（少し明るく/暗くした色）や文字色を白と黒とした場合の見た目が確認できます。
さらに近似色や遠い色とのグラデーションを作った場合のイメージも見ることができます。

実は、何かデザインを作るときに一番に見るのはこのサイトです。


ちなみに、"colorate"でGoogle検索をかけてみたのですが、他社の情報サイト/ブログで解説しているところをあまりお見掛けできず、もしかすると知る人ぞ知る名ツール、なのかもしれません。
（とはいいつつ、とても便利なのできっと秘密にしたい良いサイトのような気がしています。）


デザインをする際は配置や文字フォントも大事ですが、色の組み合わせも重要になってきます。
また、1色だけ使用色が決まっている、見せたいイメージが決まっている、など状況は様々です。
上に挙げたカラーツールを使ってもっとデザインライフが楽しくなりますように。

最後までお読みいただきありがとうございました。

ミ☆―――――――――――――――――――――――――――――――――――
Shaping our thoughts　- みえない想いをカタチに -

オフィスに関することならクロダシステムズにおまかせください！
OA機器販売/オフィス家具販売/ホームページ制作/グラフィックデザイン制作
その他どんなことでもご相談ください。
お客様に寄り添い、最適なご提案をいたします。

詳しい事業内容は

☆こちら☆

株式会社クロダシステムズ
Chroco Design　- クロコデザイン -

神戸市西区北別府5丁目15-2
Tel 078-915-7574
―――――――――――――――――――――――――――――――――――☆ミ