ウェブサイト向けカラーパレット
実際のレイアウトに耐える12組です。背景、面、本文、アクセントを賄えるだけの幅があり、同じ役割を二色で奪い合うこともありません。
- Astro
#1e1e76 の上で読める文字色:#FFFFFF
- Moon
#e7e2f3 の上で読める文字色:#111827
- Luna Of Gale
#d6e4f5 の上で読める文字色:#111827
- Ithriel
#d1c7e1 の上で読める文字色:#111827
- Moon Stone
#a6c5d9 の上で読める文字色:#111827
- Astro Novalite ♡
#1e1f2a の上で読める文字色:#FFFFFF
- What Have You Done?
#e63746 の上で読める文字色:#111827
- 男性向け Manly
#1e3b71 の上で読める文字色:#FFFFFF
- Astro
#1a1f3d の上で読める文字色:#FFFFFF
- Deep Winter
#3a498d の上で読める文字色:#FFFFFF
- Powder Ash
#bbc9c1 の上で読める文字色:#111827
- Diamond
#badae9 の上で読める文字色:#111827
サイトでの使い方
- 色より先に役割を決めます。背景、面、境界線、本文、アクセントの五つです。五つを満たせないパレットは、捨てるのではなく中間色を足してください。
- 最も明るい色は広い面に、最も暗い色は文字に。中間の色は境界線やホバー状態、補助的な文字に向きます。
- アクセントはクリックできるものだけに使います。すべてを目立たせると、何も目立ちません。
各パレットの下に示した文字色は、最初の色に対してほぼ黒と白のうちコントラストが高いほうです。ほかの組み合わせを本文に使う前には必ず確認してください。