色相・明度・彩度。配色の基本「色の三属性」。

2023.7.31

いつもどうやって使う色を決めてますか?とある方に聞かれ

もはや無意識(感覚?)でやっていることを教えるために、改めてまとめてみました。

配色の「基本の“き”」になるのはやはり色相環ですかね。

まずはこの色関係を頭に入れておくといいのではないでしょうか。

次に色の話をする上で知っておいた方がいい言葉を。

<補色>
色相環で正反対にある色、目立つ組み合わせ。
(ただしハレーション起こしやすい)
ex.)黄色→青紫

<反対色>
補色を含む、その周辺(上図だと両隣り〜2つ隣りくらい)の色。
これもハレーションに注意。
ex.)黄色→青紫とその両隣り〜青・紫

<ハレーションカラー>
目に不快感があり疲れるような彩度が高い反対色の組み合わせ。
使い方次第では効果的に立たせられる。 

<暖色>
赤を中心に黄色くらいまで。

<寒色>
濃い青〜青みの緑まで。

<パステルカラー>
赤・青・緑などの原色に白を混ぜた、淡い(彩度が低く明度が高い)色彩。

<ビビッドカラー>
明度は中くらいで彩度が高い色。

<トーン(色調)>
明度と彩度が似ている色のグループ。
デザインする際、基本的には同じ(近い)トーンでまとめる。
ex.)上図で
内側の環の組み合わせは「明度が高く彩度も低い(=淡い・パステル)」
外側の環の組み合わせは「明度が低く彩度も低い(=暗い・濃い)」
真ん中の環は「明度は中くらいで彩度が高い(=ビビッド)」

デザイン起こす際には「トーンを合わせた配色」が基本です。

私の場合は(場合によりますが、、)最初にその商品の色やイメージ、媒体の特性から

全体的なトーンを決め、次にキーカラー(≒イメージカラー)を決めます。

そこから同じトーンで3〜4色くらい(落ち着かせたいならキーカラーに近い色、賑やかさが欲しければ反対色)

でまとめるように配色します。多すぎるとまとまり悪くなりがちなので。

立たせたいところにはキーカラーの補色を最初に試します。

とまとめたものの、、

実際いつもこんなこと考えながらやってるわけではなく。

最初のトーンさえ決まってしまえば他で使う色もあまり悩まないですね。。

これに限りではないですし

要素の多さ・大きさ等で変わってしまうので。

とはいえデザイン本の最初の数ページに出てくるような「基本のき」なので、

なんか配色でしっくりこないな、という方は意識してみてはどうでしょうか(汗

色相環も「マンセル、オストワルト、PCCS…」など種類はいろいろあるので

気になる人は調べてみると面白いですよ。