「配色って、どこから手をつければいいんだろう」と思ったことはないですか。デザインの中で、配色だけは特別センスが要る気がして、なんとなく後回しにしてしまう。あるいは、なんとなく好きな色を並べてみたけど、なぜかしっくりこない——そういう経験、デザイナーならほぼ全員あると思います。
でも正直なところ、配色の悩みのほとんどはセンスではなく「手順と知識」の問題です。仕組みを知れば、自分でも再現できるようになります。この記事では、実務でよく使う配色の考え方と具体的なルールを、現場目線でまとめました。
配色で迷うのは、センスの問題じゃない
配色が難しく感じる理由の多くは「選択肢が多すぎる」ことにあります。色は理論上、無限にある。だからどこから選べばいいのか分からなくて、手が止まる。
プロのデザイナーがやっていることは、実は「何色でも自由に選んでいる」ではなく、ルールで選択肢を絞り込んでいるんです。補色を使う、類似色でまとめる、トーンを統一する——こういった「型」を知っているから、迷いにくい。
配色は「センスで選ぶもの」じゃなく、「ルールで絞り込むもの」。型を知ることが、迷いをなくす一番の近道。
では実際に、どういう手順で配色を組み立てていけばいいのか、順を追って見ていきましょう。
まず「メインカラー」を1色決めることから始める
いきなり複数色を考えようとすると、まず間違いなく迷います。最初にやることは、メインカラーを1色だけ決めること、それだけです。
メインカラーとは、そのデザインで一番目立つ色・ブランドのイメージを担う色のこと。ロゴの色、ヘッダーの色、ボタンの色——要するに「これがこのデザインの顔」と言える色です。
メインカラーを決めるときの基準は、だいたい次のどれかです。
- ブランドや商品のイメージから選ぶ自然・有機的なものなら緑、信頼・安心を伝えたいなら青、エネルギッシュさなら赤やオレンジ、といった色の印象を起点にする。
- 競合と差別化する色を選ぶ同じ業界で青が多ければあえて別の色にする、という戦略的な視点。
- クライアントの既存ブランドカラーに合わせるロゴや名刺にすでに使われている色を基準にする。実務ではこれが一番多い。
現場のコツ
「なんとなく好き」でメインカラーを選ぶのは悪くないのですが、後で「なんでこの色にしたんですか？」とクライアントに聞かれたとき答えられると強い。色を選んだ理由を一言でも言語化しておくと、提案が説得力を持ちます。
メインカラーが1色決まったら、次は残りの色をどう組み合わせるかです。ここで出てくるのが「配色ルール」です。
よく使う配色ルール3つ
配色理論はたくさんありますが、実務でよく使うのは主に3パターンです。これを覚えておくだけで、大半の配色に対応できます。
① 補色配色——対比で目を引く
補色とは、色相環で正反対に位置する色のこと。赤と緑、青とオレンジ、黄と紫がその代表例です。補色を組み合わせると、お互いを引き立て合ってメリハリのある、目に飛び込んでくる配色になります。
補色の例：青 × オレンジ
スポーツブランドや注意喚起のデザインによく使われる組み合わせ。視認性が高く、エネルギッシュな印象を与える。
ただし、補色は使い方を間違えるとうるさくなります。基本的にはメインカラーとサブカラーの面積比を7：3か8：2くらいにしておくと、バランスが取れます。両方を均等に使うとケンカしやすい。
② 類似色配色——まとまりと柔らかさ
類似色とは、色相環で隣り合った色のこと。青と青紫、黄色と黄緑、赤とオレンジなど。同系色とも言います。これを使うと、統一感があって落ち着いた印象のデザインになります。
類似色の例：青紫 × 青 × 水色
ナチュラルで落ち着いた印象。美容・ヘルスケア・コーポレートサイトなどに向いている。
類似色の弱点はメリハリが出にくいこと。アクセントとして少量だけ補色やモノトーンを使うと引き締まります。
③ 無彩色配色——シンプルに見せるときの最終兵器
白・グレー・黒の無彩色でまとめ、アクセントとしてメインカラーを1色だけ使う方法です。派手さはないですが、どんなジャンルにも使える汎用性の高さが魅力。特にモノクロ基調にして1点だけ差し色を入れるスタイルは、高級感やスタイリッシュさを出したいときに効きます。
無彩色 + 差し色の例
白と黒をベースに、アクセントカラーだけ入れる。ミニマルでどんな業種にも対応しやすい。
| 配色ルール | 向いているシーン | 注意点 |
|---|---|---|
| 補色配色 | 目立たせたい・エネルギッシュにしたい | 面積差をつけないとうるさくなる |
| 類似色配色 | 統一感・やわらかさを出したい | メリハリが薄くなりがち |
| 無彩色＋差し色 | スタイリッシュ・高級感 | 差し色の選び方で印象が大きく変わる |
トーンを揃えると、一気にまとまる
「色の組み合わせは悪くないのに、なぜかバラバラに見える」というのはよくある悩みです。その原因の多くは、色の「トーン」がバラバラになっていることです。
トーンとは、色の明度（明るさ）と彩度（鮮やかさ）を合わせた概念のこと。たとえば「パステルトーン」は明度が高く彩度が低い淡い色のグループ、「ビビッドトーン」は彩度が高くはっきりした色のグループです。
色相（何色か）が違っていても、トーンを揃えれば自然と統一感が出ます。逆に、使う色が2色しかなくてもトーンがバラバラだと、なんかちぐはぐな印象になる。
現場のコツ
「なんかまとまらないな」と感じたら、まず使っている色を並べてみて「彩度と明度のバランスが揃っているか」を確認してみてください。鮮やかな色と淡い色が混在していると、それだけでバラバラに見えます。トーンを統一するだけで、見違えるほどまとまることがあります。
また、使う色数は少ないほどまとまりやすいというのも覚えておくといいです。「メインカラー・サブカラー・ベースカラー（白や薄いグレー）」の3色以内に抑えるのが基本。そこにアクセントカラーを加えても4色まで。それ以上使い始めると、よほど慣れていないとまとめるのが難しくなります。
ちなみに、こういった配色の組み立て——「この色のトーン違いを出す」「類似色を自動で並べる」「補色を瞬時に見つける」といったことを、自動でやってくれるツールが存在します。手を動かしながら感覚をつかむのにも便利だし、「自分では思いつかない組み合わせ」が出てきたりするので、行き詰まったときに気楽に使ってみるのはおすすめです。
このサイトの無料ツール
カラーパレット生成ツール
ベースカラーを1色選ぶだけで、補色・類似色・トーン違いのパレットを自動生成。
インストール不要、ブラウザだけで完結します。
まとめ
配色はセンスじゃなく「型」で決まる。ルールを知れば、誰でも再現できる。
- メインカラーを1色決めることから始める
いきなり複数色を考えようとするから迷う。まず1色、理由を持って決める。
- 補色・類似色・無彩色＋差し色の3パターンを使い分ける
目的とシーンに合わせてルールを選ぶだけで、配色の方向性が決まる。
- トーンを揃えると、まとまりが出る
色の種類より「明度・彩度が統一されているか」を確認することが大事。
配色に正解はないけれど、「なぜこの色を選んだか」を説明できる配色は、クライアントへの提案でも自信を持って話せます。まずは型を覚えて、そこから自分なりにアレンジしていくのが近道です。