技術
ピクセルとremの変換
実際のルート文字サイズを使い、CSSピクセルをremに換算します。
文字色のコントラスト比計算ツール
不透明なsRGBの二色について相対輝度からコントラスト比を求めます。
このページについて
コントラスト比14.63
文字の相対輝度0.02
背景の相対輝度1
電卓コントロール
計算方法
不透明なsRGBの二色について相対輝度からコントラスト比を求めます。
コントラスト比 =
((0.2126*srgb(r1)+0.7152*srgb(g1)+0.0722*srgb(b1))+(0.2126*srgb(r2)+0.7152*srgb(g2)+0.0722*srgb(b2))+abs((0.2126*srgb(r1)+0.7152*srgb(g1)+0.0722*srgb(b1))-(0.2126*srgb(r2)+0.7152*srgb(g2)+0.0722*srgb(b2)))+0.1)/((0.2126*srgb(r1)+0.7152*srgb(g1)+0.0722*srgb(b1))+(0.2126*srgb(r2)+0.7152*srgb(g2)+0.0722*srgb(b2))-abs((0.2126*srgb(r1)+0.7152*srgb(g1)+0.0722*srgb(b1))-(0.2126*srgb(r2)+0.7152*srgb(g2)+0.0722*srgb(b2)))+0.1)文字の相対輝度 =
(0.2126*srgb(r1)+0.7152*srgb(g1)+0.0722*srgb(b1))背景の相対輝度 =
(0.2126*srgb(r2)+0.7152*srgb(g2)+0.0722*srgb(b2))計算例
- 文字の赤成分 (0–255): 30
- 文字の緑成分 (0–255): 41
- 文字の青成分 (0–255): 59
- 背景の赤成分 (0–255): 255
- 背景の緑成分 (0–255): 255
- 背景の青成分 (0–255): 255
- コントラスト比: 14.63
- 文字の相対輝度: 0.02
- 背景の相対輝度: 1
仮定と限界
二色の確認だけで、画面全体の適合性は証明しません。通常文字のAAは4.5:1、定義を満たす大きな文字は3:1です。丸め前の比率を使い、透明度や画像、グラデーションは別に確認します。 丸め前の比率で判定してください。
結果は表示のために四捨五入されています。計算では四捨五入されていない値が使用されます。 当社の計算方法をお読みください。
結果の理解
不透明なsRGBの二色について相対輝度からコントラスト比を求めます。 二色の確認だけで、画面全体の適合性は証明しません。通常文字のAAは4.5:1、定義を満たす大きな文字は3:1です。丸め前の比率を使い、透明度や画像、グラデーションは別に確認します。 丸め前の比率で判定してください。
このツールが役立つ場合
初期値と表示単位で例を再現し、計算途中では精度を保ってください。結果を比べる前に前提条件を確認してください。
入力内容を理解する
| 入力 | 計算例 |
|---|---|
文字の赤成分 (0–255) r1 | 30 |
文字の緑成分 (0–255) g1 | 41 |
文字の青成分 (0–255) b1 | 59 |
背景の赤成分 (0–255) r2 | 255 |
背景の緑成分 (0–255) g2 | 255 |
背景の青成分 (0–255) b2 | 255 |
よくある質問
モデルの適用範囲は？
二色の確認だけで、画面全体の適合性は証明しません。通常文字のAAは4.5:1、定義を満たす大きな文字は3:1です。丸め前の比率を使い、透明度や画像、グラデーションは別に確認します。 丸め前の比率で判定してください。
例を検算するには？
初期値と表示単位で例を再現し、計算途中では精度を保ってください。結果を比べる前に前提条件を確認してください。