デザイン制作の中で避けて通れない配色ですが、実際に色を選ぶ際にはすんなりと決まることもあれば、悩んでしまうこともあります。そこで今回は「トーン」と「色味」に着目して配色を決めていく流れについてまとめていきたいと思います。   今回の記事では、配色の方法を考える前に、まずはトーンと配色について基本的な知識に触れていきたいと思います。  

色におけるトーンとは？

色が持つ3つの性質として「明度」「彩度」「色相」がありますが、このうち同じ明度と彩度の色をまとめたものが「トーン」と呼ばれるものです。例として、下記に赤色におけるトーンのマッピングされたものを記載しています。   トーンは色を組み合わせる上でとても重要で、トーンによって見た目のイメージも大きく変わってきます。これら各トーンはそれぞれ名前があり、色味が違っても次のようなトーン固有の印象を持っています。  

ビビットトーン	もっとも彩度が高い（純色）トーンで、「鮮やかな」「派手な」「いきいきした」印象を与えます。
ブライトトーン	高彩度で明るいトーンで、「健康的な」「陽気な」「華やかな」「ポジティブな」印象を与えます。
ストロングトーン	高彩度で中明度のトーンで、「情熱的な」「力強い」「アクティブな」印象を与えます。
ディープトーン	高彩度で暗いトーンで、「伝統的な」「深みのある」「和風な」印象を与えます。
ライトトーン	中彩度で高明度のトーンで、「爽やかな」「澄んだ」「幼い」「楽しい」印象を与えます。
ソフトトーン	中彩度で明るめのトーンで、「柔らかな」「穏やかな」「ぼんやりした」印象を与えます。
ダルトーン	中彩度で暗めのトーンで、「鈍い」「くすんだ」「気だるい」「湿っぽい」印象を与えます。
ダークトーン	中彩度で低明度のトーンで、「大人っぽい」「円熟した」「丈夫な」印象を与えます。
ペールトーン	低彩度で高明度のトーンで、「薄い」「軽い」「弱い」「女性的な」「優しい」「かわいい」印象を与えます。
ライトグレイッシュトーン	低彩度で明るめのトーンで、「落ち着いた」「年老いた」「シックな」「静かな」「おとなしい」印象を与えます。
グレイッシュトーン	低彩度で暗めのトーンで、「濁った」「地味な」「ネガティブな」「悲しい」「懐古的な」印象を与えます。
ダークグレイッシュトーン	低彩度で低明度のトーンで、「陰気な」「重い」「硬い」「男性的な」「怖い」印象を与えます。

  このようにトーンごとに与える印象が異なるので、配色選定をするときにはトーンがヒントになります。求められているイメージに合うトーンでまとめることがポイントになってきます。   トーンはそれぞれの色味ごとに共通で、同じ位置関係にあります。ですので、各色味ごとのトーンをまとめるとこのような形になります。  

トーンをコントロールした配色の種類

配色ルールにはよく知られているものも多く、それらはトーンに基づいて設計されていたりします。下記には覚えておきたい有名な配色についてまとめています。トーンがどのように配色の中で活かされているかを比べてみると、それぞれの配色の違いが見えてきます。   【ドミナントカラー配色】 同一の色味で複数の異なるトーン 単一もしくはそれに近い色味の中で複数のトーンによって構成された配色です。色味が統一されているのでまとまりを出しつつも、トーンによって色味の強弱や変化をつけることでリズムを生むことができます。   【トーンオントーン配色】 同一の色味で階調のトーン ドミナントカラー配色の一種になり、単一もしくはそれに近い色味のみで構成されますが、トーンが階調になっている配色になります。トーンが規則的なグラデーションになるので、より一体感が強くなります。   【ドミナントトーン配色】 複数の異なる色味で同一のトーン 色味は複数色で構成されますが、トーンを同一もしくは近いもので揃えた配色です。トーンが揃っているので、世界観や印象にまとまりが出て、より伝わりやすくなります。また、色味も複数あるので豊かな表現が可能になります。   【カマイユ配色・フォカマイユ配色】 同一の色味で同一のトーン 単一の色味で同一のトーンにより構成されたのがカマイユ配色です。色味もトーンも近いので、とてもシンプルで印象的な配色です。色味やトーンに多少の幅をもたせて変化を強くしたものをフォカマイユ配色と呼びます。上記のサンプルで左側の3つがカマイユ配色、右側の3つがフォカマイユ配色になりますので違いを比べてみてください。  

色味とトーンをコントロールした配色の種類

このようにトーンを知り、コントロールすることで、より表現力豊かな配色が可能になります。また、色味が持つ印象とトーンのアクセントを組み合わせることで、より印象の強い魅力的な配色に仕上がります。   【ビコロール配色】 2つの色味でトーン差が大きい 2つの色味、もしくは1つの色味と無彩色を組み合わせて、トーンの差を大きくした配色です。シンプルながらも主張が強く印象に残る配色を作ることができます。商品やブランドイメージに使うと効果的です。   【トリコロール配色】 3つの色味でトーン差が大きい 3つの色味、もしくは1つ、または2つの色味と無彩色を組み合わせて、トーンの差を大きくした配色です。ビコロール配色と同じくインパクトのある配色になりますが、色味が増えることでより表現が広がります。国旗の色に採用されているのも多いですね。  

色相環上の関係による配色の種類

色味を決める際にはトーンだけでなく色相環上の関係性も重要になってきます。特に色味の数が増えてくるとバランスを取るのが難しくなってきます。そんなときには色相環で均等な配置にある色味で構成すると調和が取れやすくなります。   【ダイアード配色】 色相環上で向かい合う2つの色味による配色 色相環上で向かい合う関係にある2つの色味で構成された配色です。必然的に補色になるのでアクセントが強い配色になります。トーンを調整することでアクセントを弱くしたり、より強くすることも可能です。   【トライアド配色】 色相環上で3等分になる3つの色味による配色 色相環上で、三等分の間隔になる色で3つの色味で構成された配色です。3つの色味の位置関係を結ぶと、ちょうど三角形の形になります。正三角形に近づくほどアクセントが強くなります。3つの色味がバランスよく調和する配色です。   【スプリットコンプメンタリー配色】 色相環上で類似色と補色の3つの色味による配色 色相環上で近い位置関係にある2つの類似色と、その補色の位置関係にある色味からなる配色です。3色の位置関係を結ぶと補色を頂点とした、二等辺三角形のような形になります。実質2色の配色に近くなりますが、類似色で変化がついていることでバランスが良くまとまっている使いやすい配色ではないでしょうか。   【テトラード配色】 色相環上で4等分になる4つの色味による配色 色相環上を4等分した位置にある4つの色味で構成される配色です。色味が増えてくるとバランスをとりにくくなりますが、この配色ですと、色味ごとの違いも出せるのでしっかりとメリハリがついた配色になります。   【ペンタード配色・ヘクサード配色】 色相環上で等分割した5色・6色からなる配色 5色以上の配色の場合、同じように色数に合わせて均等に分けた位置にある色味で構成します。位置関係を結ぶと正多角形になります。カラーバリエーションを複数展開する場合の配色などはこのような方法を使うことでバランスの良い配色を作ることができます。   このように、色味とトーンを知ることでいろんな配色を使い分けることができ、伝えたいイメージや表現したい世界観を作るときにとても役に立ちます。  

---

  今回はトーンについての基本的な知識と、トーンや色味を基準にした有名な配色について触れてみました。次回はこのトーンを使ってオリジナルの配色を設計する方法について引き続き詳しくまとめていきたいと思います。