色を何色使えばいいか、迷ったとき

色を決める場面で、手が止まることはありませんか。
見出しを何色にするか、ボタンを何色にするか。
決められないまま時間が過ぎて、そのあいだに「とりあえず」で選んだ色が増えていく。
できあがったものを見ると、なんとなく散らかって見える。

色のセンスがないからだと思っている方が多いのですが、たいていは数の問題です。
使っている色が多すぎるだけ、ということがよくあります。

色が増えるほど、まとまりがなくなる

色には「ここを見てください」と伝える働きがあります。
赤い文字があれば、そこを先に見ます。
黄色い枠があれば、そこも見ます。

ところが、赤も黄色も青も緑も使われていると、どこを先に見ればいいのか分からなくなります。
全部が目立つというのは、何も目立っていないのと同じです。
散らかって見える原因は、ここにあります。

まず3色だけ決める

迷ったときは、3色に絞ってみてください。
下地の色、文字の色、目立たせる色。
この3つです。

下地の色

白か、ごく薄いグレーやベージュにします。
面積がいちばん広いので、ここに色をつけると全体の印象が一気に強くなります。
薄い色を選ぶときは、白に一滴だけ混ぜたくらいの薄さで十分です。

文字の色

本文は、真っ黒ではなく濃いグレーか濃い紺にします。
真っ黒は下地の白との差が強すぎて、長い文章だと目が疲れます。
ただし、薄くしすぎると今度は読めません。
濃さの目安は、印刷して離れた場所から見て、はっきり読めるかどうかで判断できます。

目立たせる色

ここは1色だけにします。
ボタン、リンク、見出しの一部など、見てほしい場所に使う色です。
すでにロゴや看板に使っている色があるなら、それをそのまま使うのがいちばん早い方法です。

目立たせる色を使う場所を、先に決めておく

色を3つに絞っても、目立たせる色をあちこちに使うと同じことになります。
使う場所をあらかじめ決めてしまうと、迷わなくなります。

  • 問い合わせや購入のボタン
  • 本文中のリンク
  • 見出しの下線や、頭についた小さな印
  • 1ページにひとつだけ、いちばん伝えたい一文

この4つ以外には使わない、と決めておく。
それだけで、ページの中に見る順番が生まれます。

組み合わせで迷ったときの目安

色を並べてみて落ち着かないときは、次のどれかに当てはまっていることが多いです。

  • 鮮やかな色どうしを隣り合わせている(赤と青、オレンジと緑など)
  • 色のついた背景の上に、薄い色の文字をのせている
  • 同じくらいの濃さの色を並べていて、境目がぼやけている
  • 写真の中にたくさんの色が入っていて、そこに文字の色が加わっている

鮮やかな色を2つ使いたいときは、どちらかを薄くするか、あいだに白を入れます。
くっつけないだけで、ぶつかった感じはやわらぎます。

文字が読みにくいと言われたことがある場合は、色より先に濃さを見直してみてください。
詳しくは文字が読みにくい、と言われたときに書いています。

決めた色は、控えておく

色は、そのつど選び直すと少しずつずれていきます。
ホームページの青と、チラシの青と、インスタの青が違う、ということが起きます。

決めた3色は、カラーコードで控えておいてください。
#で始まる6桁の英数字です。
メモアプリでも、スマホの写真でもかまいません。
次に何かを作るとき、選ぶ時間がまるごとなくなります。

最後に

色で迷う時間は、意外と長いものです。
3色に絞って、使う場所を決めて、控えておく。
この3つをやっておくと、次からは迷いません。

色を減らすと寂しく見えるのではないか、と心配になるかもしれません。
実際には、そろっているものは落ち着いて見えます。
まず1回、3色だけで作ってみてください。

コメント

タイトルとURLをコピーしました