色のコントラストチェッカー
文字が背景の上で読みやすいかを、WCAG のコントラスト比と AA・AAA の結果で確認できます。不合格なら、合格する最も近い色を提案します。
ブラウザ内で動作。ファイルはアップロードも保存もされません。
大きな文字の見本
この組み合わせで本文はこのように見えます。
コントラスト比
- AA、通常の文字 ≥ 4.5:1
- AA、大きな文字 ≥ 3:1
- AAA、通常の文字 ≥ 7:1
- AAA、大きな文字 ≥ 4.5:1
- アイコンとボタン ≥ 3:1
うまく動かない、または欲しい機能がありませんか？
色のコントラストチェッカーの使い方
- 文字と背景の色を選ぶか入力します。
- コントラスト比と合格したレベルを確認します。
- 不合格なら、提案された色を使います。
よくある質問
どのレベルを目指すべき？
一般的な法令やデザインの基準は AA で、通常の文字は 4.5:1、大きな文字は 3:1 です。AAA はさらに厳しい基準です。
ファイルはアップロードされますか？
いいえ。ツールはブラウザ内で動き、ページはどこにもデータを送れないようになっています。ネットを切断して確かめてみてください。そのまま動きます。
オープンソースの部品
このツールはブラウザーの標準機能だけを使います。第三者のコードは含みません。