迷ったらAdobe Color 簡単カラー配色術
デザイン制作していると、「配色が上手く決まらないな〜」ってことがよくあります。
DTPなどのグラフィック、WEBデザイン問わず、配色って悩みますよね。
そんなときに便利なのが「Adobe Color」。
カラールールによるバリエーションや、写真から色をピックアップできるので、配色に迷ったら使ってみるのもおすすめですよ。
目次
Adobe Color
Adobe ColorはAdobeが提供するカラーピックアップツールです。
ベースとなるカラーを選択すると、カラーハーモニールールに基づき様々なカラーパターンを提案してくれます。
使用にあたって、CreativeCloudなどのアカウントは必要ありませんので、簡単に始められます。
カラーホイールから色を抽出する
カラーホイールによるピックアップ方法を説明します。
ベースとなるカラーを決定後、左側の「カラーハーモニールール」からバリエーションを選択します。
カラーホイールの設定項目には、以下7つのルールがあります。
- 類似色
- モノクロマティック
- トライアド
- 補色
- コンパウンド
- シェード
- カスタム
類似色
類似のテーマは、カラーホイール上で隣接する色を使用します。同系統色をバランス良くセレクトします。
モノクロマティック色
単色の彩度と明るさのバリエーションです。同じ色相で彩度と輝度が異なる5つの色をピックアップします。うまく調和し、統一感のあるカラーセレクトです。
トライアド
カラーホイール上の3つの等距離点に均等に間隔を置いた色を使用します。このカラールールは、カラーホイールの最初のポイントとは異なる彩度と明度の値の2色を提供します。トライアドの色は、一緒に使用した場合に調和を保ちながら、対照的である傾向があります。
補色
カラーホイールで設定した1点の反対側の色（補色）をセレクトします。補色は非常に高いコントラストを与え、一緒に使用すると目を引く配色になります。
コンパウンド
補色と類似色の混合。ベースカラーを類似色の濃淡で、ボタンカラーやキーカラーは補色を使用するなど、実際のレアウトに反映しやすいですね。
シェード
同じ色相で明るさは変えたカラーパターンを提案。「類似色」や「モノクロマティック」と似ていますが、よりダークなカラーセレクトが特徴です。
カスタム
ルールを制御することなく、パレットのカラーホイールで色を手動で選択します。
画像から抽出する
実は僕がおすすめしたいのがこの機能。
色を決めるときって、ざっくり「こんなイメージ」というのが頭の中にありますよね？
具体的な風景であったり、物やイラストであったり。
この「画像から抽出」ツールでは、それら写真素材からいい感じで色を抽出してくれる便利機能です。
結構使えるので、おすすめです。
さっそくやってみましょう。
例えば、こんなカフェの写真をアップロードすると…
いい感じで、色を抽出してくれます。
次は、色数の少ないちょっと意地悪な素材をアップロードしてみます。
結構いい感じにピックアップしてくれます。
というように、十分に色の候補として使えますよね。
カラーに迷ったときは使ってみてはいかがでしょうか。
以上Adobe Colorの紹介でした。
