カラーコード変換
CSS カラーを貼り付けるか選ぶと、すべての形式で表示します。読みやすい文字のために背景とのコントラストも確認できます。
任意の CSS カラー：#2447c4、rgb(36 71 196)、hsl(227 69% 46%)、oklch(47% 0.2 265)、rebeccapurple…
| 形式 | 値 | コピー |
|---|---|---|
| HEX | — | |
| RGB | — | |
| HSL | — | |
| HWB | — | |
| OKLCH | — | |
| OKLab | — | |
| CMYK | — |
コントラスト
いろはにほへと ちりぬるを わかよたれそ つねならむ
- コントラスト比
- —
- AA 通常の文字（4.5:1）
- —
- AA 大きな文字（3:1）
- —
- AAA 通常の文字（7:1）
- —
- 白背景
- —
- 黒背景
- —
よくある質問
必要なコントラスト比は？
WCAG 2（JIS X 8341-3）の AA では通常の文字で 4.5:1 以上、大きな文字（約 24 px、太字なら 19 px）で 3:1 以上、AAA ではそれぞれ 7:1 と 4.5:1 です。ロゴや装飾の文字は対象外です。
なぜ OKLCH？
OKLCH は同じ変化量が目に同じくらいの差に見えるよう設計されています。明度だけを変えても色相が保たれるため、パレットやダークテーマ作りに向いています。主要なブラウザーはすべて CSS で対応しています。