コントラスト比チェッカー
WCAG AA/AAA準拠を即判定。
前景・背景の2色を指定するだけで、全サイズ・UI部品の適合を一覧表示。
使い方
前景色と背景色をカラーピッカー・HEX値・RGBスライダーで指定します。コントラスト比とWCAGの判定、実際の文字やボタンの見え方を同時に確認できます。
🅰 前景色 (Foreground)
#000000
🅱 背景色 (Background)
#FFFFFF
21.00:1
最高レベル · AAA基準クリア
👁 プレビュー
見出し（H3相当）
リードテキスト — 大きめの本文
これは標準サイズの本文です。WCAGのAA基準では4.5:1、AAA基準では7:1の比率が求められます。読みやすさのためには、コントラストが十分に確保されている必要があります。
🔸 これはキャプションや注釈などの小さいテキスト例です。
✨ よく使う色の組み合わせ