みなさん、ご自身の色選びに自信ありますか？

よくこうした色に関して、「センス」という表現を使いがちですが、色に限らずデザイン全般にセンスは不要です。

今回ご紹介する配色のコツを理解すれば、すぐに素人から脱却した配色ができます。

必要なのはセンスではなく、正しい知識なのです。

素人脱却！配色のコツ

原色は使ってはダメ

よくデザインを学んでいない素人の方の配色で多いのが「原色」を使用していること。

原色というのは、赤、青、黄色といった全ての色の元となっているもの。

実際に原色でテキストを打ってみるとこんな感じになります。

上記ですでに触れていますが、まず圧倒的に視認性が悪いですよね。

パット見で文字を認識するのに時間がかかる上で、目がチカチカする印象もあります。

これらの対処としては、彩度と明度を落とすこと。

IllustratorやPhotoshopで実際にデザインするときにカラーピッカーを使用することが多いですが、一番右端ではなく

少し落として色を選ぶと原色を選ばずに済みます。

よく見ると、原色を選んでいるとエラーマークがでるので、ここで判別しても良いですね。

色のトーンを揃えよう

トーンというのは、色の彩度と明度をかけ合わせた概念のこと。

デザインをする際にはこのトーンが揃っているのが望ましいです。

試しにパステルカラーのペールトーンの中に別のトーンを入れてみました。

見ての通り、1色だけオレンジが浮いてしまいっていますよね。

このように1つのクリエイティブで使用するトーンは統一するのがベスト。

色数は絞る

デザイン業界では「色数は3色まで」とよく言われます。

これはバナー広告でもそうですし、ファッションでもよく言われることの1つ。

色数は増えれば増えるほど、何を伝えたいデザインなのか分からなくなってしまうんですよね。

普段何気なく目にしている広告も、しっかり色数が抑えられているのが分かるはず。

これらは商品画像も含まれていますが、それでもなお統一感のある洗練されたデザインは、色数をしっかり絞っているからできること。

商品のパッケージの色とも親和性のある配色になっているので、ごちゃごちゃした印象はありませんね。

まさにお手本です。

ちなみにこれはグラデーションでも同じことが言えます。

上のグラデーションは白と青の2色に対し、下のグラデーションは白、緑、ピンク、青と4色を使用。

全体的にチープな印象を受けると思います。

グラデーションにおいてもなるべく色数を絞ったり、同系色で綺麗にまとめたりする必要がありますね。

配色比率は70:25:5

補足として配色比率についても紹介しておきます。

色数は絞った方が良いという話でしたが、絞った上でのバランスも意識すると良いです。

理想の配色比率は70:25:5と言われており、以下のような比率。

• ベースカラー（70%）
• メインカラー（25%）
• アクセントカラー（5%）

このバナーでいくと、ベースカラーは黄色。

ついでメインカラーはテキストに使用されている黒色ですね。

アクセントカラーは水色。

こうしてみるとしっかり「70:25:5」の比率がキープされているのが分かるかと思います。

ターゲットやテーマに沿った色を選ぼう

最後に抑えておきたいのがその配色はターゲットやテーマに沿っているかという点です。

ゲームやおもちゃなど子供向けであれば、カジュアルなイメージで色鮮やかな配色。

コーヒーなど、大人がメインターゲットとなるものでは、落ち着いたトーンの配色。

こうして「どの年齢層なのか」「男性か女性か」といったターゲティングに合わせて配色は最適化する必要があります。

また、季節も同様に配色の影響を強く受けます。

夏だと「青・イエロー」といった海や太陽を連想させる配色ですし、冬だと「白や青」といった雪を連想させる配色になることが多いです。

こうした全体のコンセプトにあっているかどうかは色を選ぶポイントになります。

学んだらすぐにアウトプットしよう

一度学んだことは、数日たてばすっかり忘れてしまいます。

ぜひ、感想や学びをツイートして、アウトプットする癖をつけましょう。