文字色と背景色を選ぶだけで、コントラスト比とWCAG（アクセシビリティ基準）の合否を判定します。基準を満たさない場合は合格する色を自動で提案するので、デザインの雰囲気を保ったまま調整できます。
🔒 この処理はブラウザの中だけで完結します
- 入力した色はサーバーに送信されません。計算はすべてお使いのブラウザの中で行っています。
基準について
WCAG 2.1 では、通常の文字はコントラスト比 4.5:1 以上（AA）、大きい文字（18pt≒24px以上、または太字14pt≒18.66px以上）は 3:1 以上が求められます。より厳しい AAA は通常文字で 7:1、大きい文字で 4.5:1 です。ボタンの枠線やアイコンなど文字以外のUI部品も 3:1 以上が必要です。日本では「みんなの公共サイト運用ガイドライン」でJIS X 8341-3（WCAG 2.0相当）のAA準拠が推奨されており、公共・自治体案件では実質的な要件になります。
WCAG 2.1 では、通常の文字はコントラスト比 4.5:1 以上（AA）、大きい文字（18pt≒24px以上、または太字14pt≒18.66px以上）は 3:1 以上が求められます。より厳しい AAA は通常文字で 7:1、大きい文字で 4.5:1 です。ボタンの枠線やアイコンなど文字以外のUI部品も 3:1 以上が必要です。日本では「みんなの公共サイト運用ガイドライン」でJIS X 8341-3（WCAG 2.0相当）のAA準拠が推奨されており、公共・自治体案件では実質的な要件になります。
薄いグレーの文字はなぜ問題なのですか？
デザイン上は上品に見えても、高齢の方・視力の弱い方・屋外でスマホを見ている人には読めなくなります。白背景に #999999 のグレーはコントラスト比2.85で、AAの4.5に届きません。補足テキストやプレースホルダーによく使われる色ですが、読めなくてよい文字はそもそも表示する意味がない、という考え方をするとよいです。
ブランドカラーが基準を満たしません
よくある悩みです。現実的な対処は3つあります。(1) そのブランドカラーは面積の大きい背景や見出しに使い、本文の文字色には使わない、(2) 文字に使う用の「濃いめの派生色」をブランドカラーとは別に定義する、(3) 白抜き文字にできる濃さまで落とす。多くの企業がブランドカラーとは別に「テキスト用の色」を持っています。
コントラスト比はどう計算されているのですか？
各色の相対輝度（人間の目の感じ方に合わせてRGBを重み付けした明るさ）を求め、(明るい方 + 0.05) ÷ (暗い方 + 0.05) で算出します。1:1（同じ色）から21:1（黒と白）の範囲になります。単純な明度差ではなく、緑が明るく、青が暗く評価されるのが特徴です。
🔒 調べた内容は記録・公開しません
- 検索した内容を保存・一覧化・公開しません。調査結果をデータベース化して検索できるようにしたり、他の利用者に見せたりすることは一切ありません。
- 検索履歴を残しません。誰が何を調べたかを紐づけて蓄積することはしません。会員登録・ログインも不要です。
- 第三者に提供・販売しません。営業リストや広告目的での利用もありません。
- サーバー負荷を抑えるため、判定結果のみ最大1時間の一時キャッシュに保持し、時間の経過で自動的に消えます。連続アクセスの制限用にIPアドレスをハッシュ化した値を最大10分間だけ保持します（元のIPアドレスは保存しません）。
- 調べた対象は共有用にURLの
#以降に付きますが、この部分はサーバーにもアクセス解析にも送信されません。
同じ分類のツール（制作の道具（ブラウザ内で完結））
アクセス情報チェックあなたのIPアドレス・ブラウザ・OSなど、サーバーに送られている情報を表示します。IP制限の設定に。URLエンコード・デコード日本語URLをパーセントエンコーディングに変換、またはその逆に戻します。複数行まとめて処理できます。HTML特殊文字変換HTMLやコードをページに載せるための実体参照変換。逆方向にも対応しています。カラーコード変換HEX・RGB・HSL・HSV・CMYKを相互変換し、明度違いのバリエーションも自動生成します。パスワード生成推測されにくいランダムなパスワードを生成します。強度と解読にかかる時間の目安も表示します。.htpasswd 生成（ベーシック認証）ベーシック認証に必要な .htpasswd と .htaccess の記述を作ります。公開前のサイトを隠すときに。Excel表 → HTMLテーブル変換ExcelやスプレッドシートからコピーしてHTMLテーブルに変換します。Markdown表にも対応。.htaccessリダイレクト生成旧URLと新URLの対応表から301リダイレクトの記述を生成します。www統一や常時SSL化の定番も。ファビコン一式生成画像1枚から favicon.ico・各サイズPNG・manifest・HTMLの記述までまとめて作ります。OGP画像ジェネレータータイトルを入れるだけで、SNSシェア用の1200×630px画像をその場で作ります。画像のWebP変換・リサイズ画像をまとめてWebPに変換・リサイズし、前後のファイルサイズを比較できます。カラーコントラスト判定（表示中）文字色と背景色のコントラスト比とWCAG判定。基準を満たす色も自動で提案します。
運営：WEBツール箱（MOTOKI合同会社）
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ