デザインに使える色の相性と配色のパターン
ここではオリジナルデザインを作っていく上で、迷いやすい配色の相性についてご紹介しています。
世の中にあるほとんどのものには色がついています。人間の目はとても優秀で、さまざまな色を見分けることができ、さらに四季が豊かな日本では、春夏秋冬でいろいろな色の世界を見ることができます。
デザインをしていく上でも色の要素はとても大切な項目の一つで、メチャクチャいいデザインができても色の使い方が悪いと全てを台無しにしてしまうこともあります。色についての記事はこれで３記事目ですが、それくらい色は大切です。
今回は色の中でも、色と色の相性についてお伝えしていきます。デザイン業界では「配色」や「配色パターン」といいます。それでは色の組み合わせの世界をちょっと覗いてみましょう。
1. 色の3属性とは？
この世界にはたくさんの商品があり、それぞれの色は意図的にその色になっています。これはデザイナーさんがその色が最適と指定しているからです。色は数えきれないほど種類がありますが、現在はある程度体系化されているので、下にある図を参考に、皆さんにご紹介していきましょう。
色相とは？
色ってたくさんありますが、その中でも「赤」や「緑」「青」などの「色味」があります。この色の違いのことを「色相」と言います。色味の違いのことです。パッとみて赤！やオレンジ！水色！というのが色相です。
単色の色については各色にイメージもあるので、詳しくは「AirPriにも使える！デザインに大切な色の影響について」をご覧ください。
明度とは？
上にあげた色相は色そのものです。この色相に対して、その色の「明るさの尺度」のことを「明度」といいます。明度を上げると、より白に近づき、明度を下げていくと、より黒に近づきます。
彩度とは？
色相、明度ともう一つの色の３属性は「彩度」です。彩度とはその色の「鮮やかさの尺度」のことです。彩度が高い色はとても鮮やかでビビットカラーに近くなります。彩度が低い色は、より鮮やかではない色になります。日本語で例えるなら「真っ赤」「真っ黄」「真っ青」が彩度が高い色というわけです。
色についての基準である「色相」「明度」「彩度」の軸を自分の中に持っていると、オリジナルデザインをしていく時に色で悩む時間を少なくすることができます。
2. トーンとは？
「色のトーン」という場合がありますが、このトーンとはなんでしょうか。トーンとは、明度と彩度が同じ色相のグループのことを指します。日本色研配色体系（PCCS）というところでそれが体系化されています。これは縦軸に明度、横軸に彩度の尺度をつけて、それに応じて色相環を配置している図です。この中から、かいつまんでご紹介していきます。
ビビットとは？
ビビットカラーは聞いたことがあるのではないでしょうか。これは彩度が一番高くてその色を一番表している色のことです。ビビットは目につきやすいので、目立たせたい時に使います。世の中ではロゴマークによく使われています。目に留まりやすい色ですが、大胆な色使いなので、繊細さを表現する時はビビットは避けた方が無難です。また場合によっては安っぽい色になることがあります。ビビットは元気な色なので、私の中では夏のイメージです。
ブライトとは？
ビビットよりも明度を上げて彩度を少し抑えた色味です。彩度を落とした分、ビビットほど派手さはありませんが、自然に近い色味になっています。また、明るくて健康的な色味なので、よく使われる色味です。カジュアル、ポップというイメージも持たれやすいです。明度を上げていくと、どんどん女性的な色になっていきます。女性や子供向けの商品によく使われます。
ディープとは？
ブライトとは真逆で、ビビットよりも彩度と明度を下げた色味です。明度を下げた分黒が少し入るので、落ち着いた印象やクラッシックな印象になります。色は残しつつも落ち着いた感じの色なので、秋によく使われる色です。
また、わびさびを大切にしてきた日本らしい色味にもなるので、和を表現したいときはこの色味はオススメです。
ライトとは？
ブライトよりもっと彩度を下げて明度を上げた色味です。ブライトよりももっと柔らかい印象になるので、これも女性向けの商品に多い色です。また「カワイイ」という印象も与えるので子供向けにもよく使われる色です。オリジナルTシャツを女性の仲間で着る時はオススメです。また時期の中では「春」を表す時にも使われています。
ダークとは？
ディープよりもさらに明度と彩度を下げた色味です。より黒色の要素が色に入ります。色は残しつつも黒による重みもあるので、大人っぽい印象があります。格式を重んじるような場面でも登場する色です。女性というよりは男性に使われる色味でもあります。季節感でいうと秋を想起させる色です。
ペールとは？
ライトの明度を上げて彩度を落とした色味です。より白に近づくので、ふんわりと軽いイメージやより柔らかいイメージを持っています。優しい色味なので、これも女性的な印象や、子供の中でも赤ちゃんに使われる色味です。通常のデザインでは、背景色などに使われます。ビビットとは逆になるので目立ちにくく、ロゴなどにはあまり使いません。逆に「春」や「柔らかさ」を表現したい時はこのペールがオススメです。
グレイッシュとは？
明度が落ちた分、黒の要素がもっと増えてさらに落ち着いた印象を与える色味です。ビビットと反対なので、「元気」という印象はなく、年配の人向けのファッションによくみられる色味です。ただ、地球の自然の中にある色でもあるので「アースカラー」とも呼ばれていて、自然派の商品やナチュラルを押し出したい時にはよく使われます。
3. 色の組み合わせの考え方
異なる二つ以上の色を組み合わせるには、いくつかの考え方があります。これをマスターするのは至難の業ですが、そのパターンをいくつか簡単にご紹介しましょう。
同系色の色
一番合わせやすいのは、同系色の色の配置です。私もよく服を着る時に使っています。同系色のパターンは３つあります。
・同色で明度か彩度が違う
・同色でトーンを変える
・トーンを変えて近い色
同系色にするメリットは、まとまりが出ることです。デメリットは単調になりやすくなることです。明度や彩度を調整してコントラストをつけると、そのデメリットを小さくすることができます。
有彩色と無彩色
今まででみてきた、赤や青、黄色、緑などは色が明確にあるので「有彩色」といいます。これに対して黒、白、グレーなどの色味が無い色のことを「無彩色」といいます。この有彩色と無彩色は、どの組み合わせでもうまくまとまりを出してくれます。つまり黒や白は、ほとんどの有彩色と相性がいいです。
この基準を一つ持っていれば、色に困ったらとりあえず有彩色と無彩色を組み合わせると色が早く決まりやすいです。 グレーも使いやすい色ですが、明度が近い色と組み合わせると色の違いがハッキリしないため、分かりにくい印象を受ける色合いになります。グレーを合わせるときは明度に差をつけた方がお互いの色を引き立たせてくれます。
セパレーション
使いたい色が２つあるけど、隣で使うとケンカしちゃうんだよなーという場合は、その間に黒や白、グレーなどの無彩色を使ってあげるとバランスを取ることができます。無彩色以外の色でもセパレーションとして使うこともありますが、どんな色でも合う無彩色の方が比較的簡単に合わせることができます。
色の違いを生かした色を使う
同系色や無彩色を使った色使いはチョット大胆さに欠けるなーという方には、色相差を生かす方法があります。基本は色相環を参考にして、使いたい色の隣か２つ隣の色を使います。同系色の明度や彩度を使うよりもチョット大胆になります。例えば、黄色を使いたいときは、黄色が含まれているオレンジと緑は黄色と相性がいい色になります。考え方が同系色と近いので、これも合わせやすい配色になります。
補色を使う
色相環を参考に、使いたい色の真反対の色のことを「補色」といいます。一番色の差が大きいので、この補色を使うとダイナミックな印象の配色になります。彩度が高い色の補色を使うと派手な配色になる一方で、カジュアルな印象にもなります。使いたい色の補色をちょっとだけ使うと、使いたい色をとても引き立ててくれるメリットもあります。
補色の類似色を使う
使いたい色の補色（反対側の色）の近くの色を使うテクニックもあります。これは補色を使う場合と同じで、ダイナミクな配色になります。補色を使うよりも選択肢が多いので使う色の幅が広がります。
マルチカラーの配色
今までは色の組み合わせでしたが、これは３色使う場合です。色相環の中に三角形を作ることになります。特にルールなどはありませんが、三角形の形を綺麗にした頂点にある色を使うと比較的まとまる配色になります。４色使う場合は、その四角形の形のバランスをとった場所の色の配色がキレイに見えやすいです。
ナチュラルハーモニー
今までは色の組み合わせでしたが、これは３色使う場合です。色相環の中に三角形を作ることになります。特にルールなどはありませんが、三角形の形を綺麗にした頂点にある色を使うと比較的まとまる配色になります。４色使う場合は、その四角形の形のバランスをとった場所の色の配色がキレイに見えやすいです。
4. 単色の色について
配色は２色以上の色の組み合わせです。色は組み合わさることで相乗効果でよりキレイになったり、より目立ちやすくなったり、逆に不快感を与える場合もあります。この色の組み合わせの前に、その単色ごとでの色のイメージや色の働きなどについて知りたい方は、別の記事のリンクを貼っておいたので、こちらからどうぞ。
5. まとめ
ここまで配色についてみてきました。いかがでしたか？意外と色は奥が深いですよね。色相環を詳しく表すものとして3Dのものもあるくらい色はたくさんあるのでプロでも色は迷います。でもその中でもPCCSのように一定の基準がある場合が多いので、色で迷った時の灯台のような使い方でこのページを活用してもらえたら嬉しいです。まずはオリジナルデザインを楽しくしたいというのがAirPriの根底なので、デザインも配色も楽しみながら進めてもらえたらいいなと思います。 最後まで読んでいただきまして、ありがとうございました。
