カラーコードとパレット
ホワイトのカラーコード
ホワイトは RGB で最も明るい色で、多くの UI のメインの面になります。余白と明快さを生み出しますが、上に置くコントロールには見える境界と十分なコントラストが必要です。
ホワイト
#FFFFFF
カラー形式
同じベースカラーを主要な Web 形式で表しています。
濃淡
| カラー | 名前 | HEX | RGB | HSL | コピー |
|---|---|---|---|---|---|
| White 50 | #F2F2F2 | 242, 242, 242 | 0, 0%, 95% | ||
| White 100 | #D9D9D9 | 217, 217, 217 | 0, 0%, 85% | ||
| White 200 | #BFBFBF | 191, 191, 191 | 0, 0%, 75% | ||
| White 300 | #A6A6A6 | 166, 166, 166 | 0, 0%, 65% | ||
| White 400 | #8C8C8C | 140, 140, 140 | 0, 0%, 55% | ||
| White 500 | #737373 | 115, 115, 115 | 0, 0%, 45% | ||
| White 600 | #595959 | 89, 89, 89 | 0, 0%, 35% | ||
| White 700 | #404040 | 64, 64, 64 | 0, 0%, 25% | ||
| White 800 | #262626 | 38, 38, 38 | 0, 0%, 15% | ||
| White 900 | #0D0D0D | 13, 13, 13 | 0, 0%, 5% |
文字のコントラスト
これらの比率は WCAG の相対輝度の式で計算しています。
Aa 白い文字 1.00:1
不合格
Aa 黒い文字 21.00:1
AAA
ホワイトの使い方
ページとカードのメインの面
ミニマルなレイアウトの余白
暗い背景の上の高コントラストな文字
ホワイト と相性のよい色
#FFFFFF をもとにした色相環の配色。スウォッチをクリックしてコピーするか、カラーホイールで開けます。