コントラストチェッカー
WCAGのAAおよびAAAアクセシビリティ基準に対応した無料オンラインカラーコントラスト比チェッカー。テキストと背景色を入力して適合性を即座に確認できます。
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
21:1
Contrast Ratio
| WCAG AA | WCAG AAA | |
|---|---|---|
| Normal Text | ||
| Large Text |
使い方
- テキストの色をHEXコード（例：#333333）で入力するか、カラーピッカーで選択します。
- 同じ方法で背景色を入力します。
- チェックボタンをクリックして、コントラスト比を即座に計算します。
- 結果を確認し、WCAG AAまたはAAAの基準を満たしているか確認します。
- 目標のアクセシビリティレベルに達するまで、必要に応じて色を調整します。
例
入力: テキスト色：#1a1a1a、背景色：#ffffff
結果: コントラスト比：19.32:1 — 通常テキストと大きなテキストのWCAG AAおよびAAAをクリア
よくある質問
コントラスト比は、2つの色の相対的な明るさの差を数値で表したものです。1:1（コントラストなし）から21:1（黒と白の最大コントラスト）の範囲があります。高いコントラストは、視覚障害のあるユーザーを含むすべての人にとって読みやすいテキストを実現します。
WCAG AAは通常テキストに対してコントラスト比4.5:1以上、大きなテキスト（18pt以上または14ptの太字）に対して3:1以上を要求します。AAAはより厳しく、通常テキストに7:1以上、大きなテキストに4.5:1以上が必要です。
いいえ、すべての計算はお使いのブラウザ内でクライアントサイドで処理されます。入力した色の値やその他のデータはいかなるサーバーにも送信されません。プライバシーは完全に保護されています。
日本では、JIS X 8341-3（WCAG 2.1に基づく）がウェブアクセシビリティの標準規格として定められています。公共機関のウェブサイトではこの規格への準拠が求められており、民間サイトにも推奨されています。
はい、このツールはHEXコード、RGB値、そして視覚的なカラーピッカーに対応しています。お好みのフォーマットを使用して正確なコントラスト計算を行うことができます。