LANDERGROW · ツールキット
カラーコントラストチェック
文字と背景のコントラストを WCAG AA・AAA 基準と比較し、読みやすい配色をプレビューできます。
無料 · 登録不要入力内容とファイルはブラウザー内で処理します
読みやすい言葉で、アイデアを伝える
文字と背景の色の組み合わせを確認できます。
5.54:1
AA · 通常の文字✓ 適合
AA · 大きな文字✓ 適合
AAA · 通常の文字— 不適合
AAA · 大きな文字✓ 適合
使い方
文字色と背景色を 16 進数で入力。
コントラスト比と通常・大きな文字の結果を確認。
目的の基準を満たすまで色を調整。
参考資料: W3C · WCAG 2.2 ↗
よくある質問
AA・AAA の基準は？
AA は通常の文字で 4.5:1、大きな文字で 3:1 以上。AAA はそれぞれ 7:1、4.5:1 以上です。大きな文字は通常 24 CSS px 以上、太字なら約 18.67 px 以上を指します。
合格すればサイト全体がアクセシブルですか？
いいえ。2 つの不透明な単色間の文字コントラストのみを計算します。キーボード操作、代替テキスト、グラデーション、背景画像などの要件は確認しません。
LANDERGROW AI
無料で作成を始める準備ができたら、アイデアをサイトに
LanderGrow AI でサイトやページを作成し、画像、リンク、ブランドをお客様に届けましょう。