pickup
色のイメージと色相環や補色

この記事を見ているあなたは『ここは何色にしたらいいかな〜?』と色の配色に関してお悩みなのではないでしょうか?

そんなあなたのためにデザインの印象が大きく変わる色相環や補色について詳しく解説したいと思います。

スポンサーリンク

デザインの配色をする上で重要な色相環

イラスト制作やバナー制作の時など、何色と何色を組み合わせればいいか迷う事ってありますよね?

伝えたい内容の重要な部分を強調したい時や、デザインをする上で色の配色の仕方はかなり重要になります。

色の配色の仕方にはある程度のパターンがあり、そのパターンを理解していると色々な物をデザインする際の色の選び方がスムーズになるのではないかと思います。

まず初めに、デザインの配色パターンで重要になってくる『色相環』について詳しく解説したいと思います。

色相環とは?

色相環

色相環

色は光の変化によって、赤→橙→黄→緑→青→藍→紫の七色に見えます。

この様な色の変化を連続的に24色に配列し円環状にしたものを『色相環』といいます。

イメージとしては虹の色を丸く繋げた感じです。

※私たちが一般的に目にする色相環は、日本色彩研究所が開発したPCC
(日本色研配色体系)で、1〜24の色相番号とアルファベットで色相を表現しています。

 色相環を用いてデザインをすると、より目立たせるためにはこの配色、優しい印象を与えるためにはこの配色、など色の組み合わせによって人に与える印象が違って見えてきます。

色相環を用いた配色には7パターンあります。

色相環を用いた配色
  • 同一色相配色(同じ色相同士の配色)
  • 隣接色相配色(隣り合った色相同士の配色)
  • 類似色相配色(色相の近い配色)
  • 中差色相配色(色相差が90度に位置する色同士の配色)
  • 対象色相配色(色相が大きく離れた均等間隔にある配色)
  • 隣接補色配色(補色色相配色の一歩手前の配色)
  • 補色色相配色(色相環上で180度に位置する反対の配色)

この中でもよく用いられる配色を以下で紹介していきたいと思います。

類似色相

色相環・類似色相

類似色相

類似色相画像

類似色相画像

色相環で両隣にある色、またはその近くの色味が似ている色で、デザインに適度な共通性と変化が感じられる組み合わせなので、バランスのとれたまとまりのある自然な配色になります。

赤いロゴの様に類似色相は色味のまとまりがあり、全体的なデザインの配色には適していますが、選択する色相の幅(色相差)が狭いため、メリハリを出すのにはあまり適しません。

緑のロゴの様に、類似色で統一された和みのあるロゴの背景に白を用いるとより目立つデザインになります。

ポイント
類似色相同士の配色でメリハリを出すには、背景色と文字色の濃淡に極端な差をつけると目立って見えます。

中差色相

色相環.中差色相

中差色相

中差色相

中差色相

式相環で90度の位置にある色を組み合わせた色で、赤と黄色、青と緑などの配色は、主に東南アジアなどの民族衣装などによく使用される配色で、彩度を落とすと、伝統的な配色になります。
※韓国のチマチョゴリなど
調和がとりにくくデザイン意図のハッキリしない配色とも言われますが、色同士対立しながらも共通性があります。
中佐色相を上手く取り入れている例として、マクドナルドやタワーレコードのロゴが考えられます。
購買意欲を掻き立てられる赤に、明るい印象の黄色がきいてとても親しみやすいイメージです。
ポイント
目立つ色同士の配色なので背景とロゴの間に黒や白などの色を挟むとより目立つデザインになります。

対象色相

色相環.対象色相

対象色相

補色色相

補色色相

色相環上で大きく離れた位置にあり、等間隔にある色とされます。

お互いの色を強調する組み合わせなので、強烈な印象を与えます。

色味の違いが大きいので、派手で賑やかな印象を与え、中南米などの国旗などに使用される事の多い配色です。

画像のロゴの様に、背景や文字に白を用いる事で爽やかな印象も与えつつ赤で購買意欲を煽る配色になっていると思います。

ポイント
ほぼ補色になるので濃淡で色の差をつけてデザインすると調和します。

補色とは?補色の効果と注意点

色相環.補色

補色

色相環補色ロゴ

補色ロゴ

色相環上で180度の位置にありもっとも色相差のある色味の事を『補色(反対色)』と言います。

補色はお互いの色を目立たせる効果があり、赤色-緑色,黄色-青色などの補色は非常に目立ちます。

画像の様に、鮮やかな色同士引き立てる効果があるので、特に飲食店のロゴや、看板、パッケージなどによく使われる配色です。

サイゼリアやグラッチェガーデンズなどのロゴはまさに補色の基本の様な配色ですね。

ポイント
補色それぞれの色の面積比などを変え、アクセントとして取り入れると補色の効果が発揮されます。

補色の注意点

色相環ハレーション

ハレーション

補色画像

補色のロゴ

同じ割合で補色を並べると、派手でインパクトはありますが、目がチカチカして見えることがあり落ち着かない印象になってしまいます。

この現象を『ハレーション』と言います。

このハレーションを防ぐには間に白や黒などの色を挟む事をオススメします。

セブンイレブンの看板も赤と緑の補色が使われていますが、ハレーションを起こさない様に白ベースが使われています。

町を歩いていると補色でデザインされた物は沢山あります。

例えば、TUTAYAの看板の配色は「爽やかで親しみやすい印象」を与える青色に「明るく元気な印象」を与える黄色をロゴで使用した、補色効果が最大限に発揮されたデザインになっている事がわかります。

黄色が「明るく元気な印象」を受ける様に、デザインをする上で色の持つイメージも重要になるので触れておきますね!

色の持つイメージ

色は人の心理に働きかける効果があると言われており、色のもつイメージを知る事で制作物のデザイン配色は大きく変わってきます。

色を見た時どんな印象を与えるか以下にまとめてみました(^○^)

ピンク
・優しい・可愛い・女性的・恋・愛情・恋愛・感謝・繊細・好意・幸せ・思いやり
・高級・気品・優雅・神秘・忍耐・直感・高貴・威厳・知識・スピリチュアル
・冷静・知的・清潔感・清涼感・調和・誠実・洗練・革新・倫理・直感力・誠実さ
・安全・安心・信頼・休息・健康・癒し・穏やか・若者・新鮮・自然・順応・希望・リラックス・マイペース
黄色
・明るい・元気・楽しい・好奇心・幸福・協力・希望・想像・素直・行動・輝き・無邪気さ・ユーモア
・エネルギー・注意・力・闘争心・情熱・生命・革命・積極的・外向性・活気
・高級感・力強さ・洗練・神秘・リッチ・優雅・高貴・落ち着き・保守的・リセット・頑丈・威厳
・清潔感・高級感・清潔感・純白・美しい・新しい・浄化・平和・洗練・神聖・高貴・スタート

色の持つイメージはこんなにも様々です。

細かい事や詳しいことは知らなくても、色をみたときに『高級そうだな』とか『女性的だな』など何かしらの印象を持つと思います。

そんな、色が持つ印象効果のことを色彩感情といい、その色が何かと結び付いて連想(イメージ)されることを色彩象徴と言います。

色彩感情を理解した上で補色を組み合わせてデザインをするとより人に伝わりやすい配色ができる様になると思います。

まとめ

いかがですか?

色相環や色の持つイメージを理解するとデザインをする上での配色がより人に伝わりやすくスムーズになると思います。

今回の様な色やデザインについて学ぶのにオススメの書籍があるのでぜひこちらもご覧ください!

とてもわかりやすく書かれている書籍で、初心者から上級者まで持っていて損のない一冊です(^。^)

読みやすいデザイン、伝わるプレゼン資料、わかりやすいレイアウトについての基本書になります。

スポンサーリンク

Twitterでフォローしよう

おすすめの記事