DESIGN ACCESSIBLY
色のコントラスト確認
HEX・RGBで前景色と背景色を指定し、コントラスト比と通常文字・大きな文字のWCAG判定を確認できます。
ログイン不要。入力内容は外部へ送信されず、このブラウザ内だけで処理されます。
使用方法
まずは数字を入れて、比較・判断を速く。
前景色と背景色をHEXまたはRGBで入力します。比率とAA・AAAの判定を確認し、必要なら「入れ替え」で配色を比べます。
計算式・ロジック
sRGBを線形化した相対輝度Lを用い、コントラスト比 ＝ (明るい色のL＋0.05) ÷ (暗い色のL＋0.05) として算出します。
FAQ
よくある質問
通常文字と大きな文字の基準は何ですか？
WCAGのコントラスト基準を表示します。通常文字のAAは4.5:1以上、大きな文字のAAは3:1以上です。
比率が高ければ必ず読みやすいですか？
比率は重要な目安ですが、文字サイズ、太さ、周囲の要素、利用状況もあわせて確認してください。