3色の配色・カラーパレット

ベース、文字、アクセント。三つの役割を決めて、まとまりのある配色に。

背景を最も広く、アクセントを最も小さく使うところから調整してみましょう。

静かな緑

#EEF0E8
#314F42
#B8C8A4

白に近い緑の背景、深緑の文字、明るい緑のアクセント。

面積の比較用です。文字色は別途コントラストを確認してください。

この配色を編集する

温度の違い

#F0D4B6
#B8654D
#355764

暖色の中に深い寒色を加えると輪郭がはっきりします。

面積の比較用です。文字色は別途コントラストを確認してください。

この配色を編集する
色見本を1枚の図で見る
3色の配色・カラーパレットの色見本。各色のHEXコードを併記。
掲載データから作成した画面用の色見本。実物の色票ではありません。操作できる一覧は上にあります。

自分の配色に、少し変えてみる。

気になる色を色板に集めて編集・書き出しできます。組み合わせを作り直すなら配色ツールへ。

配色をつくる

このページの情報を訂正する