WCAGカラーコントラストチェッカー

よくある質問

コントラスト比とは何ですか？どのように計算しますか？

コントラスト比は、WCAG 2.1が定義する2色間の輝度差の数値指標です。1:1（同一色、コントラストなし）から21:1（純黒と純白）の範囲で、計算式は(L1 + 0.05) / (L2 + 0.05)です。L1とL2はそれぞれ明るい色と暗い色の相対輝度を表します。

WCAG AAとAAAの違いは何ですか？

WCAG AAは多くの国で法的最低基準とされており、通常テキストに4.5:1、大きいテキストに3:1のコントラスト比を要求します。WCAG AAAは高度な基準で、通常テキストに7:1、大きいテキストに4.5:1を要求し、弱視や読字困難のユーザーに適しています。ほとんどの法規制はAAを義務付けており、AAAはベストプラクティスの目標です。

WCAGの「大きいテキスト」はどのように定義されますか？

WCAGでは大きいテキストを、通常ウェイトで18pt（24px）以上、またはボールドウェイトで14pt（約18.67px）以上と定義しています。大きなテキストは低いコントラストでも読みやすいため、WCAGはより低い閾値を適用しています。これらのサイズ未満のテキストはすべて通常テキストとして扱われ、より厳しい4.5:1（AA）または7:1（AAA）基準が必要です。

色覚シミュレーションでコントラスト比が変わるのはなぜですか？

色覚シミュレーションは知覚モデル（Machado 2009、重症度1.0）を線形sRGB空間で適用して色を変換します。変換後のRGB値の相対輝度が元の値と異なるため、コントラスト比が変化します。正常視覚でWCAG AAに合格する組み合わせが、赤盲（1型）や緑盲（2型）のユーザーには不合格になる場合があり、このツールはそのギャップを可視化します。

このツールは色データをどこかに送信しますか？

いいえ。コントラスト比の計算、WCAGバッジの評価、色覚異常シミュレーション、修正提案のすべてが、JavaScriptによりブラウザ内で完結します。色の値がAppicLabのサーバーや第三者に送信されることは一切ありません。

自動修正提案はどのように使いますか？

色の組み合わせがWCAG AAに不合格の場合、提案パネルにはテキストまたは背景色の明度を最小限に調整してターゲット比を達成する方法が表示されます（元の色相と彩度を維持）。「適用」をクリックするとリアルタイムでプレビューでき、hexコードを直接コピーすることもできます。サイコロアイコンをクリックすると、基準を満たす新しいランダムなパレットを生成できます。

カラーコントラスト不足で罰金や訴訟を受けることはありますか？

はい。米国ではADA（障害を持つアメリカ人法）がウェブサイトに適用され、カラーコントラスト不足などを理由に連邦裁判所で企業が訴えられた事例があります。EUでは欧州アクセシビリティ法（EAA）により、ほとんどのデジタル製品・サービスは2025年6月までにWCAG 2.1 AA準拠が義務付けられ、違反には各国の罰則が科されます。英国の2010年平等法も同様の義務を課しています。政府・公共機関のサイトはより厳しい適用を受けます。WCAG AAのコントラスト基準を満たすことは、法的リスクを下げるうえで最もコストパフォーマンスの高い施策の一つです。

出典

• WCAG 2.1 達成基準 1.4.3（コントラスト最低限） — 本ツールで用いている 4.5:1 / 7:1 のコントラスト閾値を定義する W3C のアクセシビリティ標準。
• Machado・Oliveira・Fernandes（2009年）— 色覚多様性シミュレーション — 本ツールの 1 型・2 型・3 型色覚プレビューが採用している生理学的根拠のあるシミュレーションモデル。