ホーム グラフィックス、HP素材の作り方 無料素材、HP素材 デザインのスキルアップ 成者のためのリンク集

配色のコツ

色は1つ決まってくると、あとはチャートに合わせて、調和する色を選び出していくことが出来ます。
その色の1つは、わかりやすく自分の好きな色でいきましょう。

まずこの中から、自分の好きな色を選びます。

好きな色が決まったら、カラーチャートから合う色を選び出します。

 もっとも基本的な選び方は、その色と反対側の色とで組み合わせます。

 

a.

特に1番の赤と、7番の緑の組み合わせは明度が高くて両方が反発し合うために、ずっと見てると目がおかしくなります。

b.
そこで、赤か緑または両方の明度を調節します。
(明度を上げるということは、ある色にを混ぜることになり、
明度を下げるということはある色にを混ぜることになります。)

緑の明度を下げて配置してみました。
a.の赤よりやさしい赤に見えますが、赤の方は変更していません。
1つの色を変えるだけで、もう一方の色まで変わってしまったように見えるのです。
それが色の魔力です。


明度の下がった緑が、
外の赤の明るさを吸収し、ギラつき感がなくなりました。

c.
次は赤のほうの明度を下げてみます。
(これまた、緑がのa.の緑よりやさしい色に見えますが、緑の方はなにもさわってません。)
緑の明るさが明度の下がった赤に吸収されて、見やすくなりました。

 

こんな感じで、ある色と反対の色は調和すると言われていますが、
反発し合うことが多く、明度・彩度の操作が必要です。

d.
操作の要らない例

(目には個人差、環境差があります。この色でも反発し合ってると思う方もいるかもしれません。)

両方の色・全体を見て落ち着いて見えれば、操作は要りません。

色の組み合わせには常に臨機応変が必要です。

わたしが色について学んだ本です。
読んで覚えるというよりも、常にそばに置いておき、何かに行き詰まったとき何かヒントが欲しいときに、この本を 開きます。


カラー&タイプ―色と文字の基本原理と応用事例
 

色とタイポグラフの関係について、例をたくさんあげて解説されています。
色相環から、透明感のある配色、約1000ものカラーチャートは、今でもわたしの色やタイポグラフィー、字の配置などに悩んだら、これをバイブルさながら片手にデザインしています。

ホームページでも、あるひとつの色を変えただけで全体のバランスがぐちゃぐちゃになってしまう事例を、たびたびみてきているので、この本を読んでからは慎重に色の選択を行うようになりました。
色の選択ミスをホームページの完成後に気づいても、直すのに時間がかかりますからね。

 

 

ページの先頭に戻ります