コントラストチェッカー
アクセシブルな配色のための WCAG コントラスト比を確認します。
コントラストチェッカーは、2色間の WCAG コントラスト比を測定し、通常・大きい文字の AA/AAA 合格バッジと、AA を満たす濃淡の提案色を表示します。
プレビュー
The quick brown fox jumps over the lazy dog
コントラスト比: 17.72:1
AA 合格AA 大きい文字 合格AAA 合格AAA 大きい文字 合格
AA 対応の提案色
#0a0a0b
コントラスト比 19.79:1 · より濃く
#000000
コントラスト比 21:1 · より濃く
#26262b
コントラスト比 15.06:1 · より明るく
#35353b
コントラスト比 12.18:1 · より明るく
#43434c
コントラスト比 9.79:1 · より明るく
使い方
- 前景色を入力または選択します。
- 背景色を入力または選択します。
- コントラスト比、合格バッジ、AA 対応の提案色を確認します。
よくある質問
良いコントラスト比とは？
通常文字の WCAG AA は 4.5:1、AAA は 7:1 以上です。
大きい文字とは何ですか？
通常 18pt または 14pt の太字で、AA のしきい値は 3:1 です。
提案色はどう生成されますか？
前景色の明度を白または黒方向に調整し、4.5:1 に達した色を提案します。