無彩色を土台にする
白・黒・グレーは多くの色と合わせやすく、迷ったときの基準になります。
基準色の明暗
厳選パターン
SCORE = W3C WCAG 2.2 に基づく可読性 + 配色の階層感 / 調和の近似評価。 公式基準は可読性部分です。
配色辞典
イメージ別サンプル
よく使われる印象別の3色構成
色相環
現在の基準色の位置
赤
橙
黄
緑
青
紫
トーン図
現在の基準色をトーンで見る
配色の基本
同系色でまとめる
同じ色相で明度や彩度だけを変えると、整った印象を作りやすくなります。
色相差で強弱を作る
類似色は穏やかに、補色や対照色は目立たせたい場面に向いています。
自然界の配色を使う
光は黄寄り、影は青紫寄りになりやすく、自然な調和を作る参考になります。
色数は増やしすぎない
3色前後に絞ると整理しやすく、主役と脇役の関係もはっきりします。
コントラストで読む
きれいさだけでなく、文字の読みやすさと色同士の差も同時に見ます。