コントラスト比チェッカー

文字色と背景色のコントラスト比を計算し、WCAGのAA・AAA基準を確認。通常サイズと大きな文字の判定を比較できます。

ブラウザー内で処理し、データはアップロードしません。

値を設定

値を設定

前景色と背景色を入力し、計算された比率と各基準の判定を確認します。 色のコントラストだけを確認します。ページ全体のアクセシビリティや法令への適合を保証するものではありません。

結果

ここに結果を表示します。

入力値やファイル内容を統計に含めず、どのツールが使われたかを集計します。 プライバシー

ツールの使い方

  1. 前景色と背景色を入力し、計算された比率と各基準の判定を確認します。
  2. 色のコントラストだけを確認します。
  3. ページ全体のアクセシビリティや法令への適合を保証するものではありません。

具体的な使用例

入力
  • 文字色: #000000
  • 背景色: #ffffff
結果
21:1 AA・通常の文字: 適合 AA・大きな文字: 適合 AAA・通常の文字: 適合 AAA・大きな文字: 適合

制限と確認事項

  • 前景色と背景色を入力し、計算された比率と各基準の判定を確認します。色のコントラストだけを確認します。ページ全体のアクセシビリティや法令への適合を保証するものではありません。

参考資料

実用ガイド

コントラスト比を、丸め誤差とテーマの違いまで確認する

違う色に見えても、文字が読みにくい組み合わせはあります。実際の文字色と背景色を測り、文字の大きさや画面の状態も確認しましょう。

手順を見る

お気に入り