白い背景のグレー #767676(通常の文字で合格)
通常の文字で基準に届く最も薄いグレーとして知られる #767676 の例です。4.5:1 のぎりぎり上を確かめられます。
入力
文字色
#767676
背景色
#ffffff
文字の大きさ(CSS ピクセル)
16
太字
いいえ
結果
エラー 0 件・警告 0 件・情報 1 件
指摘(エラー・警告・情報)
- 情報 判定 コントラスト比 4.54 : 1 は、16 ピクセル(通常の文字)に必要な 4.5:1 以上です(WCAG 2.2 SC 1.4.3 の数値基準を機械的に満たします)。ただし達成基準の適合そのものの判定ではありません。
| 文字色 | #767676 |
|---|---|
| 背景色 | #ffffff |
| 文字色の相対輝度 | 0.1812 |
| 背景色の相対輝度 | 1.0000 |
| コントラスト比 | 4.54 : 1 |
| 入力した大きさでの判定 | 満たす(4.5:1) |
基準ごとの判定
| 文字の区分 | 必要な比 | この色の組 |
|---|---|---|
| 通常の文字 | 4.5 : 1 | 満たす |
| 大きな文字(18pt 以上、太字なら 14pt 以上) | 3 : 1 | 満たす |
検算(この結果になる理由)
#767676 の各チャンネルは 118 で、線形化した値は約 0.181、相対輝度 L は約 0.181 です。比は (1.05) ÷ (0.181 + 0.05) で約 4.54 となり、4.5 以上のため合格でエラーは 0 件です。
判定の根拠は仕様と根拠に、仕様の出典とともにまとめています。自分の入力で試すにはツールをお使いください。
このツールの制約
- 画像・写真・グラデーションの背景の上の文字、透明度(アルファ)つきの色は扱いません。重ねた後の不透明な色を入力してください。
- 色の名前(red など)・rgba()・hsl() は読めません。#rrggbb か rgb() に直して入力してください。
- 文字以外のアイコンや枠線のコントラスト(別の達成基準)は判定しません。
- 文字の大きさ・太さは入力された値だけで判断します。実際に描画されるフォントの大きさは確かめません。
ご利用にあたって
- 結果は機械的に判定できる規則だけにもとづく目安で、アクセシビリティの達成基準に「適合している」ことを示すものではありません。適合の判断には、実際の画面での確認と専門家のレビューが必要です。