配色に悩んだときに、きっと役立つ7つの配色技法【基本】

私は「色」が好きなので、配色を考えるのがそんなに苦ではないんですが、良い配色が思い浮かばず、苦しんでいるWebデザイナーさんは沢山います。
人の目で見分けられる色の数は750万色以上あると言われていて、デザイナーはこの膨大な色の中から配色を考えるんですが、これが結構大変なんです。経験を積んだWebデザイナーさんでも何日も配色に悩み、目の下に隈を作ることがあると聞いたことがあります。
そこで今回は、配色を考える時や、配色に悩みすぎて出口が見えなくなってしまった時に役立つ、基本的な7つの配色技法を紹介したと思います!
基本的な7つの配色技法
これから紹介するの7つの配色技法は、お互いに明確な違いがない物もいくつかありますが、あくまでもこれらは配色の方向性・配色の考え方を示すものだと理解してください。それでは早速、例を交えながら特徴と効果をまとめて紹介させていただきます。
ドミナントカラー配色
ドミナントとは「支配」するという意味です。色相を統一した多色配色をドミナントカラー配色といいます。
色相は同一色相で、トーンは自由に選択できる配色です。ただし必ず同一色相にしなければならないわけではなく、色相に統一感がある場合は隣接・類似色相から選択しても構いません。色と色との明度差を小さくすることでより統一感が生まれ、色によるイメージの支配を強く図ることができます。
効果
統一感を与えることができる配色です。また色そのものが持つイメージも強く与えることができます。
ドミナントトーン配色
トーンを支配し、トーンを統一した多色配色をドミナントトーン配色といいます。
トーンは同一で、色相は自由に選択できる配色です。ただし必ず同一トーンにしなければならないわけではなく、トーンに統一感がある場合は隣接・類似トーンから選択しても構いません。
効果
にぎやかな印象を与えやすく、統一感も与えることができる配色です。またトーンそのものが持つイメージも与えることができます。
※トーンが持つイメージは[カラーデザインの基本。トーンを理解する!]で確認できます。
トーンオントーン配色
トーンオントーンとは「トーンを重ねる」という意味です。色相を統一し、明度差を大きくとった多色配色をトーンオントーン配色といいます。トーンオントーン配色はドミナントカラー配色の一種です。
色相は同一で、トーンは自由に選択できる配色です。ただし必ず同一色相にしなければならないわけではなく、色相に統一感がある場合は隣接・類似色相から選択しても構いません。
効果
統一感を与えることができる配色です。また色そのものが持つイメージも与えることができます。
トーンイントーン配色
トーンイントーンとは「トーンの中で」という意味です。トーンを統一し、明度差の小さくした多色配色をトーンイントーン配色といいます。トーンイントーン配色はドミナントトーン配色の一種です。
トーンは同一で、色相は自由に選択できる配色です。ただし必ず同一トーンにしなければならないわけではなく、トーンに統一感がある場合は隣接・類似トーンから色を選択しても構いません。
効果
にぎやかな印象を与えやすく、統一感も与えることができる配色です。トーンその物が持つイメージも与えることができます。
※トーンが持つイメージは[カラーデザインの基本。トーンを理解する!]で確認できます。
トーナル配色
ダルトーンを中心とした中間色同士の配色のことをトーナル配色といいます。ドミナントトーン配色やトーンイントーン配色と仲間です。
トーンはダルトーンを中心とした(ソフト・ライトグレイッシュ・グレイッシュの)4つのトーンで、色相は自由に選択できる配色です。
効果
素朴なイメージ、落ち着いたイメージを与えやすい配色です。またソフト・ライトグレイッシュ・グレイッシュ・ダルトーンがもつイメージを与えることもできます。
※トーンが持つイメージは[カラーデザインの基本。トーンを理解する!]で確認できます。
カマイユ配色
カマイユとは、フランス語で「単色画」という意味です。微妙な濃度・明暗の変化だけを用いた同一・隣接色相の配色のことをカマイユ配色と言います。
色相は同一・隣接で、トーンは同一・隣接から自由に選択できる配色です。また遠くから見ると一色に見えるような、あいまいな配色です。
効果
統一感を与えることができる配色です。また色の差がはっきりしないため、ボンヤリとした印象を与えることがあります。
フォカマイユ配色
フォとは、フランス語で「偽の」という意味です。フォカマイユは、カマイユに対して色相が偽物という意味です。カマイユ配色よりも、少し色相やトーンに差をつけられる配色のことをフォカマイユ配色と言います。
色相は同一・隣接で、トーンは同一・隣接から自由に選択できる配色です。
効果
統一感を与えることができる配色です。またフォカマイユ配色はカマイユ配色よりも色の差がハッキリするので、ボンヤリとした印象が軽減されます。
最後に
いかがでしたでしょうか。配色技法って結構沢山あるので、悩みすぎて出口が見えなくなったときなど、こういった技法に頼ってみるのもいいんじゃないでしょうか。
今回紹介したものはあくまでも、一般的によく利用される基本的な配色技法です。実際にはもっとたくさん配色技法があります。例えばダイアード/2色配色とか、トライアード/3色配色・中差色相配色などもそうですね。そのうち分類わけして、こういった様々な配色技法も紹介したいと思います。またこちらの記事[配色の基本。メイン・サブ・アクセントカラーを極める!]も読んでいただけると、より配色に関する理解が深まるかと思います。
では、このへんで!
-
[...] http://creators-manual.com/color_scheme7/ [...]
-
[...] Webクリエイターズマニュアル 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 ダウンロードしておきたいフリーのデザインフォントのまとめ -2012年6月 [...]
-
[...] 【1】配色に悩んだときに、きっと役立つ7つの配色技法【基本】|Webクリエイターズマニュアル 配色とレイアウト(配列)がきちんできていれば、ある程度のクオリティは確保できる [...]
-
[...] 2. デザイン:配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] ンを使った配色の技法は下記サイトを参照して下さい。 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 基本らしいです。一度目を通すだけでも全然違うと思います。 [...]
-
[...] 配色を考える時に役立つ方法 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] 6.配色に悩んだときに、きっと役立つ7つの配色技法【基本】 (2012/06/29 11:13) [...]
-
[...] http://creators-manual.com/color_scheme7/ [...]
-
[...] 、カマイユなど7つの配色技法を、具体的な例を用い説明しつつ、配色によってもたらされる効果を知ることができます。 → 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 [...]
-
[...] web creators manualの人気記事 配色に悩んだときに、きっと役立つ7つの配色技法【基本】 ツイート1402|いいね!426|はてなブックマーク2525 [...]
カラーサークルの中の p itとか、アルファベットは色の名前ですか?