前回は色の持つ力について書きました。

そこで、今回はその色をどう使ったらいいかという配色方法をご紹介します！

だれでもできる！3色を使った配色術

７０：２５：５

この比率、何だかご存知ですか？
配色は「ベースカラー」「メインカラー」「アクセントカラー」の
3つの構成要素からできていて、
７０：２５：５＝ベースカラー：メインカラー：アクセントカラー
の比率が最も美しく見えると言われています。

ではそれぞれの役割についてご紹介します。

■ ベースカラー

配色をする上で最も広い面積になる色です。
背景となることが多いので、薄い色や明度が高い色にしておくと
文字も見やすくなるのでオススメです。
※ベースカラーに蛍光色を使ってしまうと目が痛くなってしまうので、控えましょう

■ メインカラー

名前の通りメインとなる色です。
この色で全体のイメージが決まるので、
前回のコラムで書いた色相心理を踏まえて色を考えるといいですね！

■ アクセントカラー

ポイントとなる色です。
例えば、お問合せボタンやキャチコピーなど
一番目立たせたいポイントにアクセントカラーを持ってくると上手くまとまります。

アクセントカラーの決め方ですが、メインカラーの反対色を使うとはっきりした配色になるので、
配色に慣れるまでは反対色を使うことをオススメします。
※反対色は下の色相関で対角線にあたる色のことです。

（反対色を使うと視認性が悪くなることもあるので、様子を見て配色しましょう！）

７０：２５：５で配色してみよう！

では早速、配色してみましょう。
前回のコラムで使った画像の配色違いを用意してみました。

■メインカラーを青にする

爽やかで誠実な印象の配色になりました。
アクセントカラーをメインカラーの反対色であるオレンジにして、
一番目立たせたいボタンにポイントを作っています。

■メインカラーを赤にする

なんだかクリスマスみたいな配色になってしまいましたが…
元気で力強い印象の配色になりました。
このバナーを見たら、体育会系な会社なのかな？と思ってもらえそうですね！
（キャッチコピーの文字に動きを付けると、より力強い印象になそうです）

■メインカラーを青緑にする

フレッシュで若々しい印象になりました。
求職者に若い人たちが多い会社なのかな？と思ってもらえるんじゃないでしょうか。

まとめ

いかがでしょうか？
今回は、７０：２５：５＝ベースカラー：メインカラー：アクセントカラー
を意識した配色方法をご紹介しました。

★　ベースカラーは明度高め
★　メインカラーは色相心理を意識して
★　アクセントカラーは一番目立たせたいポイントに使う

デザインにも配色にも正解なんてないので、
今回ご紹介したのはほんの一例として考えてもらえたら嬉しいです。

The following two tabs change content below.

• この記事を書いた人
• 最新の記事

【インビジョン広報隊長】ちあき

最新記事 by 【インビジョン広報隊長】ちあき (全て見る)