公開 更新

guide · 配色

デザインの色は何色まで?|3つの役割と増やす基準

色数の固定上限はありません。迷ったら土台・主役・強調の3役に絞り、分類・状態・ブランドなど別の仕事があるときだけ増やします。多色の例外、文字とのコントラスト、状態変化を含む点検方法まで解説します。

配色を学ぶ余白灯舎の場面
リオかわいい色を見つけるたびに足してたら、投稿画像が6色になっちゃった。デザインの色って、何色までならいいの?
トウカ……その6色は、それぞれ、何の仕事をしているの?

数より先に、役割を決める

「何色まで?」という問いは、じつは順番が逆で、先に決めるべきは数ではなく係です。配色の定番は、次の3つの役割に分けることです。

役割 働き 例(焼き菓子店のチラシ)
土台(ベースカラー) 背景と本文を支える 生成りのクリーム色
主役(メインカラー) その紙面らしさをつなぐ 焼き色のブラウン
強調(アクセントカラー) 行動や要点を知らせる 深い赤

この係決めが済んでいれば、装飾のためだけの色は減ります。3役を1系統ずつにするのは迷う人の出発点であり、必要な色数の上限ではありません。係を決めずに好みだけで足すと、どの色を手がかりに読めばよいか分かりにくくなります。

同じ主役色でも、濃くした見出し、薄くした背景帯のように、明るさ違いは同じ係の仲間として扱えます。焼き色のブラウンなら、濃いこげ茶の見出し、薄茶の背景帯まで、ブラウン係の一員です。ただし、濃淡ごとに文字とのコントラストは測ります。

面積には固定比率を置きません。強調色が広がりすぎて主役と競っていないか、必要な状態色を装飾へ流用して意味を濁していないかを確認します。強調は、周囲との差と役割の限定で働きます。

3色に絞ると整う理由

色は1色ごとに「意味がありそうだ」という期待を読む人に持たせます。赤い文字が1カ所だけなら「ここが大事なんだな」と伝わります。赤も、緑も、紫も使われていると、色の意味を推理する手がかりが消え、ただにぎやかな紙面になります。

色数を絞ることは、コントラストを効かせる準備にもなります。周りが静かだから、1つの声が届く。たとえるなら図書館での小さな案内のようなもので、静けさが強調を助けます。ただし、この例が示すのは相対差だけです。必要な色数は、写真、グラフ、警告表示、ブランド規定によって変わります。

もうひとつの実利は、判断が速くなることです。新しい要素を足すたびに「この色は土台・主役・強調のどれか」と聞くだけでよく、無限の色見本から選び直す迷いがなくなります。色の約束を先に決めて守る、この考え方の全体はトンマナと呼ばれます。

色を増やしていい場面の基準

3色は出発点で、増やすことが誤りなわけではありません。判断の軸は「その色に、ほかの色とちがう仕事があるか」です。仕事があるなら増やしてよい、なければ増やさない。具体的には、次のような場面です。

このとき増やした色は、装飾ではなく記号です。分類のための4色を、ついでに飾りにも使い回すと、記号としての意味が濁ります。仕事を与えた色には、その仕事だけをさせてください。

写真の扱いは補足しておきます。焼き菓子の写真には焼き色もクリームの白も苺の赤も写っていますが、これらを1色ずつ数える人はいません。写真は「多色の1要素」として土台や主役と調和させるもので、むしろ写真から主役色を拾うと、紙面全体が写真と仲良くなります。

「カラフル=楽しい」の思い込み

子ども向け、お祭り、セール。楽しさを出したい場面ほど「色をたくさん使えば楽しくなる」という思い込みが働きます。実際の売り場や絵本を観察すると、楽しい印象の多くは色数ではなく、明るい色調と、大きな形の動きから来ています。

多色の紙面は、楽しさを出せる一方、主役や分類の意味が見えにくくなる場合があります。色数ではなく、土台がそろい、各色の役が説明できるかを見ます。文字と色の両方が競っているなら、チラシが詰まって見える原因とあわせて間隔も見直します。

楽しさを色数に頼らず出すなら、主役色を明るく元気な色にする、強調色との明度差を大きくする、という2手が先です。

あえて多色にする例外

判断基準の外側に、あえて色数の上限を外す作り方もあります。文具メーカーの色見本のような「色そのものが商品」の場面、多様性をテーマにした企画、こまかい色紙を散らすデザインなどです。

多色にする場合も、各色の役割と、主役以外をどう控えるかを説明できることが条件です。背景を無彩色にする、文字の色や書体を絞る、写真の彩度を整えるなど、静けさの作り方は1つではありません。色の祭りを開くなら、会場の建物との競合を点検する。この比喩を入口にし、実際はブランド、可読性、状態色の必要性を優先します。

つまり例外もまた、役割の考え方の上に立っています。無計画な10色と、設計された10色は、同じ色数でも別のものです。

身のまわりの1枚で、色の係をたしかめる

今日のワーク:色の棚卸し

身のまわりの広告か、自分が過去に作った1枚を選んで、使われている色を紙に書き出してください。そのうえで、それぞれを「土台・主役・強調・仕事あり(分類など)・仕事なし」のどれかに割り振ります。

  • 「仕事なし」に入った色が、その紙面のごちゃつきの候補です
  • 強調が2色以上あったら、どちらか1つを主役か土台に降格できないか考えてみます

うまく割り振れない色があっても、それ自体が発見です。作った本人が係を言えない色は、読む人にはもっと説明のつかない色に見えています。

この棚卸しは、目的が明確な広告や案内で練習すると比較しやすくなります。係の言えない色が見つかったら、消した版と残した版を並べ、読み手が最初に見る場所の変化を確かめます。

Webでは通常・選択・エラー・無効の状態色も数え、色だけで意味を伝えていないか確認します。印刷物では、特色や印刷方式の制約も別にあります。役割の説明と媒体の仕様を両方満たす範囲で色数を決めます。

色数を決めることは、主役を決めること

「何色まで?」の答えは、数字の3ではなく、土台・主役・強調という役割の側にありました。3色は最初に比較しやすい標準案で、分類、状態、ブランドなど新しい仕事があれば増やせます。多色にする場合も、主役、文字の読みやすさ、色だけに頼らない意味の伝え方を同じ条件で確かめます。

今日から使える合言葉は、「足すときは係を聞く。迷ったら土台に混ぜる」です。色が競って見えたとき、役割を点検する入口として使ってください。

色の係決めができたら、次はその強調色をどこに置くかです。押してほしい場所を色で示す実例として、ボタンが「押せそう」に見える仕組みが次の一歩につながります。