配色の手助け
WEB・DTPデザインで悩みがりな配色問題。今回そんなときに便利なツールをご紹介いたします。
Adobe Color CCとは？
Adobe Color CCとはAdobeが提供している配色サイトです。
カラー、雰囲気、キーワードなどのイメージを入力することで何万通りのカラーパターンを作ることができます。
このサイトで作成したカラーパレットはAdobe製品であればそのまま使用することができます。
基本利用には登録も必要ないので無料で、お手軽に使うことができます。
《基本手順》
❶カラーハーモニーを選択
❷カラーホイールを動かす
❸カラーコードをコピー
■カラーホイール
ベースカラーからテーマに沿った配色を作成することができます。
〈各テーマについて〉
＊類似色
ベースカラーに類似する色が表示されます。
＊モノクロマティック
ベースカラーの明度と彩度のみを変更した色が表示されます。
＊トライアド
色相環の中に正三角形をあわせた時、それぞれ3つの頂点にくる色でつくる3色配色
＊補色
色相環上で基準となる色相の反対に存在するのが「補色」です。ベースカラーがより際立つ色合いになります。
＊分割補色
補色そのものではなく、補色に隣接する色を補色の代わりに使う配色。
＊正方形（テトラード配色）
色相環を正方形で4等分した位置にある色で配色する方法です。カラフルな印象になります。
＊コンパウンド
補色と類似色の混合となります。ベースカラーを類似色の濃淡で、メインカラーは補色を使用する配色で落ち着いた色合いに。
＊シェード
同じ色相で明度を変えた配色です。類似色やモノクロマティックと似ていますが、ダークな配色が特徴です。
＊カスタム
ルールを制御することなく、カラーホイールで色を手動で選ぶことができます。
■テーマを抽出
写真などの画像からカラーを抽出して、カラーパレットを作成してくれる機能です。
■グラデ―ションを抽出
写真などの画像からグラデーションを抽出して、カラーグラデーションを作成してくれる機能です。
■アクセシビリティツール
コントラストのチェックや、カラーユニバーサルデザインを考慮した配色も作成可能です。
＊コントラストチェッカー
設定したテキストカラーと背景色の、可読性や数値をチェックしてくれる機能です。
画面右側にコントラストの提案も表示されます。
Adobe Color CCを使って、配色に悩む時間を短縮させることができればより効率的に作業を進めることができるのではないでしょうか。
« デジタルイラストとアナログイラスト LINEスタンプ »