【デザイン】色の組み合わせでデザインにメリハリを

オリジナルグッズをデザインするとき、重要な役割を果たすのが「色」ではないでしょうか。
組み合わせで悩む方も結構多いのでは?

今回はデザインを際立たせる、上手な色の組み合わせ方法についてお伝えします。

 

基本の色相環を知ろう

色相環とは、基本となる色相を順序立てて円状にして並べたもののことを言います。
カラーピッカーで似た形状を見たことがある方も多いのでは。

MunsellColorCircleマンセルシステムでの色相環 ※参照:Wikipedia「色相」

マンセルシステム上では3原色「赤(R)・黄(Y)・青(B)」に「緑(G)・紫(P)」を加えた5種類の基本色を元に、それぞれの中間色を加え、知覚的に等間隔なるように配列されています。
私たちはこの色相環上の色を基本に、彩度や明度を上げたり下げたりすることで色を決定しています。

color_palette色の印象が一緒に分かるトーンの表 ※参照:色相環とトーンの表を使って色の意味をデザインに生かそう

「ペール」は優しい春の色合いですが、「ライトグレイッシュ」は淡くも落ち着いた色味。
「ダーク」は渋みのある大人っぽいカラーです。
同じ色相環でも、明度や彩度を変えるとガラリと印象が変わるのがよくわかりますね。

 

 

重要な役割を果たす「挿し色」

基本となる色を決めたら、あとは「挿し色」を考えましょう。
「挿し色」つまり補色は、基本色を色相環上に置き換えた際に正反対に位置する関係の色の組合せのことを言います。
つまり、上記の色相環では「赤(5R)」だったら補色は相対する「緑(5BG)」、「黄(10Y)」なら「紫(10PB)」が補色です。

例えば「緑のカエル」をモチーフとしてイラストを描いたとします。

kaeru_0

 

kaeru_baseマンセルシステムの色相環に則り、カエルの色を「10G」のグリーンにしたので背景色を補色である「10RP」に設定しました。

kaeru_variationそのままだとちょっと明度/彩度が近すぎるので、色を調整していきます。
この辺はお好みで。色調補正を駆使してしっくりくる色を見つけていってください。

kaeru_mycolorCanvathブログの執筆者はこんな色合いが好きなので、↑のように落ち着きました。
カエルと背景の色は最初に決めた基本の色から少し変えましたが、それぞれの補色から少し近い色合いではあるので「挿し色」としての役割を果たして言います。

最初に背景の色を設定した時のように、相対する色の明度や彩度が近すぎるとお互いの色を打ち消しあって全体的にぼやけた印象になってしまうことがあります。
淡い色には渋い色や濃い色を組み合わせることで引き締めたり、暗い色にはペールトーンやグレイッシュトーンを合わせ柔らかい印象を加えたり、メリハリをつけていくとよりデザインが引き立ちます。

 

迷った時はツールを使おう。

それでもどうしても色が決められない…という時は、こんなツールに頼ってみましょう。

palettable_topPALETTABLE

最初に設定した色を基本に、ランダムでマッチする色をチョイスしていってくれる便利なツール。
好きな色だったら「L(Like)」ボタンを押し、そうじゃなければ「D(Dislike)」ボタンを押すだけという簡単設計。

palettable_sample

自分では思いもよらない色をチョイスしてくれるので、いつも同じような組み合わせばかり選んでしまう、という方には特におすすめです。

colorhuntColor Hunt

毎日様々なカラーパレットが登録されているサイトです。
好きな組み合わせを選ぶとプレビューが表示され、色のイメージを確認できます。
パレットは最新作や人気のあるものまで、表示切り替えが可能。
これは!という色の組み合わせを探してみてください。

 

──────────────────

いかがでしたか?
色の組み合わせは無限大です。
一つに決められなかったら「色違い商品」を作って人気の色の組み合わせを模索するのも良い戦略かもしれません。

Canvath(キャンバス)なら全てのオリジナルグッズを1つから作成可能ですので、様々な色の組み合わせで試しに作ってみてくださいね。

この記事を書いた人

Canvath(キャンバス)で一緒にメディアを作りませんか?

Canvath(キャンバス)を通して、オリジナルグッズの新たなメディア作りに興味のある方を探しています!
Canvathのミッションに共感してくれる方、メディア作りに興味のある方、絶賛募集中です!
一緒にCanvath(キャンバス)を盛り上げましょう!