コントラスト比チェック
そもそも読めるのかどうか。
出力
上に貼り付けるか入力すると、ここに結果が表示されます。
ファイルは端末の外に出ません
このツールはすべてブラウザ内で動作します。貼り付けた内容は端末内で処理され、サーバーには送信されないため、トークンや鍵、未公開の文章でも安心して使えます。
使い方
- 1行に1組ずつ、#333 on #fff のように入力します。カンマでもスラッシュでも空白でもかまいません。
- 色を1つだけ書いた場合は、上で指定した背景色と比べます。
- まず比率を見てください。ほかはすべてそこから決まります。
- 本文なら4.5が越えるべき数字です。
よくある質問
- AAとAAAは具体的に何を求めていますか。
- AAは本文に4.5対1、大きな文字に3対1を求めます。大きな文字とは24px、または太字の18.66px以上です。AAAはそれぞれ7対1と4.5対1。境界線・アイコン・入力欄の枠は3対1です。
- このグレーが落ちるのはなぜですか。
- 白地に #777 は4.48対1で、AAに0.02足りません。よくある惜しい失敗であり、人がわざわざ確かめる理由でもあります。選んだ本人には問題なく見え、相当数の人には実際に読みにくいからです。#757575 なら通ります。
- どちらの色を先に書くかで変わりますか。
- 変わりません。比率は対称なので、文字色と背景色を入れ替えても同じ数字になります。
- 比率が通れば「アクセシブル」と言えますか。
- 言えません。コントラストは数ある要件のひとつにすぎず、フォーカス表示、押せる大きさ、動き、色だけで意味を伝えていないかについては何も語りません。最低ラインであって、合格判定ではありません。
- 入力した内容はどこかに送られますか。
- いいえ。ブラウザの中で動くので、貼り付けた内容はお使いのパソコンから出ません。