：2012年05月01日　 ：カラーデザイン　 ：色彩能力　 ：この記事は6分程で読めます。

前回の[カラーデザインの基本。トーンを理解する！]と[カラーデザインの基本。色の三属性とは？]に引き続き、今回はメインカラー・サブカラー・アクセントカラーの基本ルールについて解説させていただきます。このメイン・サブ・アクセントカラーの基本ルール正しく理解すると、配色を考えるのが簡単になります。
頻繁に配色を悩む方や、デザインの途中で配色を変えてしまう方は、このメインカラー・サブカラー・アクセントカラーのルールを正しく理解できていない可能性があります。なので今回解説するこの記事を読んで、配色についての理解を深めましょう！(偉そうに書いちゃいました。すみません)

ちなみに配色という言葉を辞書で引くと、『2つ以上の色を組合わせること。また、組合わせた色合いのこと』と書いてあります。

メイン・サブ・アクセントカラーの役割

まずは、メインカラー・サブカラー・アクセントカラーと呼ばれる、各要素の役割について紹介いたします。この3つの要素を正しく理解することが、配色を極める第一歩となります。

メインカラー

配色の構成要素の中で、最も大きな面積を占める色のことをメインカラーといいます。全体のイメージを作り出す役割を持っています。

サブカラー

メインカラーに次いで面積が大きく、メインカラーを補う役割を持っています。

アクセントカラー

配色の構成要素の中で、最も小さい面積でありながら、もっとも目立つ色です。全体を引き締めたり、ユーザーの目を引く効果(役割)を持っています。

上記で紹介した3つの要素に対する厳密な面積比率は無いんですが、おおまかにメインカラー7割、サブカラー2.5割、アクセントカラー0.5割とされています。この面積比率を守ると、美しい配色に仕上がりやすくなります。

色は使用する面積で印象が変わる

赤色はアクティブな印象を与えるといわれていますが、以下のサイトのように、アクセントカラーとして利用した場合、アクティブな印象をユーザーに与えることができるでしょうか？

The White House
答えはNOです。派手で力強い赤色も、これだけ小さく使用すると、アクティブな印象を与えることが出来なくなります。上記で紹介した【メイン・サブ・アクセントカラーの役割】で説明したように、全体のイメージを作る出すのはメインカラーです。なのでこのサイトの場合、私たちは濃い青色がもたらす、聡明さや落ち着いた印象を受けることになります。

このように、色は使用する面積で大きく印象を変えます。配色において色の使用面積は非常に大切です。同じ3色を使った配色であっても、色の面積の違いで印象は大きく変わってきます。下記がその例です。

いかがでしょうか？左の配色は赤をメインカラーに使用しているのでアクティブで力強い印象を受けませんか？　右は灰色がメインカラーなので控えめで落ち着いた印象を受けませんか？　たとえ、このような印象を受けなくても、この2つの配色がまったく違う印象になったことは理解出来たと思います。

メイン・サブ・アクセントカラーの選び方

実際にデザインするときに、どのように色を決めたら良いのか、参考になる方法をご紹介いたします。

メインカラーの選び方

メインカラーは、ユーザーに何を伝えたいかで選ぶことが大切です。色にはそれぞれ印象があります。赤ならアクティブ、青ならクールなど様々です。与えたい印象で選べば、色選びで迷うことも少なくなります。
また、メインカラーに高彩度の色を使うのはあまりお勧めできません。メインカラーは面積が大きいので、高彩度の色を使用してしまうと目がチカチカします。もし高彩度の色をメインにする場合は、使用量を減らすようにすることが大切です。また、そのときはサブカラーとアクセントカラーの使用量も減らし、面積比率は守るようにしましょう。

サブカラーの選び方

サブカラーは、メインで選んだ色を補う色を選ぶようにします。具体的にはメインカラーのイメージを補うと考えると良いでしょう。例えば、冷静な印象を与えるためにメインを青にした場合、より冷静さを伝えたければサブに紺色や水色などを選びます。また冷静さにプラスして安全な印象も与えたい場合、サブに緑色などを利用します。

アクセントカラーの選び方

アクセントカラーは目立たせるための色なので、メインカラーとサブカラーと比較して目立つ色を選ぶようにしましょう。目立つ色を選ぶポイントですが、色相・明度・彩度のうち、2つ以上がメインカラーと異なる色を選ぶ事がポイントです。

配色って3色しか選べないの？

配色はメイン・サブ・アクセントの3つで構成されていることが分かっていただけたと思いますが、1つの要素に対して1色しか使えないわけではありません。
例えば、メインカラーであれば、水色と青といったように、2色を使ってもかまわないんです。サブカラーやアクセントカラーも同様に、2色・3色と選んでもかまいません。ただし色の数を増やすと、デザインのバランスをとる事が難しくなってきます。また、あまり色を細かく分けていくと、伝えたいイメージが損なわれる可能性が高くなります。なので最大でもメイン3色・サブ3色・アクセント3色の合計9色まででまとめると良いと思います。

最後に

今回紹介したメイン7対・サブ2.5対・アクセント0.5の法則といいますかルールのようなものを、私はファッションデザインの勉強中に知りました。なので、この法則は洋服選びのときにも使えますし、部屋の模様替えの時などでも使えると思います。色彩の能力はWEBだけでなく、様々な分野で生かせるんです。

いかがでしたでしょうか？多少は参考になりましたでしょうか？説明不足なところ、突っ込みたくなるところがいくつもあると思いますが、そこはご愛嬌でお願いいたします！私自身まだまだ勉強不足です。偉そうに失礼しました！

では、この辺で！