ページの表示モードを切り替える
なにこれ？
HEXの2色（前景色と背景色）のカラーセットからコントラスト比を計算し、WCAG2.1が定める基準を達成しているかを検証します。
詳細
- HEX以外を入力すると正しく判定できません
- 複数のカラーセットを比較できます
- テキストエリアに連想配列を入力してカラーセットに変換できます
- 逆に、調整したカラーセットを連想配列に変換できます
達成レベルのAAとAAAについては下記のリンクを参考にしています。
本検証ツールではコントラスト比が 3.0 以上 4.5 未満で「Not Bad」とし、3.0 未満は「Fail」としています。
「Not Bad」「Fail」の区分は本検証ツールが独自に提案しているものであり、WCAGが公式に示している指標ではありません。
また、WCAGの基準に達していないからといって見づらいとは限りませんし、達しているからといって全て見やすい訳ではありません。
コントラスト比の数字だけ見て判断せず、実際のプロダクトに当てはめて包括的な判断をするための補助ツールとしてご利用ください。
カラーセット欄にある「大きなテキスト」のラジオボタンで、大きなテキストサイズの時の達成基準をトグルできます。
大きなテキストとは、日本語の場合22pt以上のテキストか、もしくは太字で18pt以上のテキストを指します。
テキストエリアから色を入力する
※オブジェクトのkeyとvalueはダブルクォーテーションで囲ってください。
判定するテキストのサイズを切り替える