Color Contrast Checker とは何ですか？
カラーコントラストチェッカー Web designer、front-end developer、accessibility specialist 向けの無料オンラインツールです。2 色間の contrast を素早く計算し、 WCAG 2.1（Web Content Accessibility Guidelines）標準に基づき、AA / AAA のアクセシビリティ要件への適合状況を評価します。
WCAG contrast とは何ですか？
WCAG 2.1 は、相対輝度（Relative Luminance）の式を使って前景色と背景色のコントラスト比を計算する方法を定義しています。コントラストが高いほど文字を読みやすくなり、特に弱視のユーザーにとって重要です。
- AA 基準： 通常テキストは 4.5:1 以上、大きなテキスト（18 pt または太字 14 pt）は 3:1 以上が必要です
- AAA 標準： 一般テキストは ≥ 7:1、大きなテキストは ≥ 4.5:1 が必要です
なぜコントラストが重要なのですか？
十分なカラーコントラストは、すべてのユーザーの読みやすさを高めるだけでなく、アクセシブルな Web デザインの重要な要素でもあります。世界では約 2 億 1,700 万人が中等度から重度の視覚障害を抱えているとされ、適切なコントラストを確保することでサイトの包摂性を高め、法的リスクの低減にもつながります。
このツールの使い方は？
使い方は簡単で、左側へそれぞれ設定するだけです。前景色（文字色） 付き背景色, カラーピッカー、または HEX、RGB、HSL 値の直接入力で色を調整できます。右側にはライブプレビュー、コントラスト値、WCAG 評価結果が即時表示されます。配色が基準を満たさない場合は、具体的な改善案も提示します。
コントラストの計算方法
contrast は WCAG 2.1 specification の relative luminance formula に従って計算します：L = 0.2126 × R + 0.7152 × G + 0.0722 × B、ここで R、G、B は Gamma-corrected sRGB 値です。Contrast Ratio = (L₁ + 0.05) / (L₂ + 0.05)。ここで L₁ は明るい色、L₂ は暗い色です。