コントラスト比チェッカーとの違いは何ですか？

コントラスト比チェッカーは2色の組み合わせを詳しく確認するツールです。こちらは3〜6色のパレットをまとめて登録し、すべての文字色×背景色の組み合わせを一度に判定します。デザインシステムやサイト全体の配色を決めるときに向いています。

行列の見方を教えてください。

縦が文字色、横が背景色です。各セルにコントラスト比とWCAG判定（AAA・AA・大字・不可）が表示されます。本文にはAA以上、見出しなど大きな文字は大字以上を目安にしてください。

2色から6色まで登録できます。ブランドカラー・背景色・文字色・アクセント色など、実際に使う色をまとめて入れて確認してください。

コントラストが不足した配色は、高齢者・弱視の方・屋外のスマホ利用などで読めなくなります。日本でも公的機関のWebはWCAGへの準拠が求められており、一般サイトでも読みやすさは離脱率に直結します。

複数の色をまとめて登録し、全組み合わせのコントラストをWCAG基準で一括判定。本文に使える配色がひと目でわかります。

配色（2〜6色）

本文に使える（AA 4.5:1以上）組み合わせは 6 / 12 通りです。

縦＝文字色、横＝背景色。AAA／AA（本文OK）／大字（大きな文字のみ）／不可。数字はコントラスト比。

ページごとに色を場当たり的に選ぶと、サイト全体でトーンがばらつき、読みにくい箇所も生まれます。先に4〜5色のパレットを決め、その中で「本文に使える組み合わせ」を把握しておくと、どのページでも一貫した読みやすい配色になります。このツールはその「使える組み合わせ」を一目で確認するためのものです。