カラーコントラストチェッカー
アクセシブルなWebデザインのためにWCAG 2.1 AA/AAAカラーコントラスト比を確認
rgb(30, 41, 59)
rgb(248, 250, 252)
Sample Text Aa
The quick brown fox jumps over the lazy dog
Regular body text — this is how a paragraph will appear at 16 px.
Small helper text at 14 px — used for captions and labels.
Color Contrast Checker — WCAG AA/AAA
Check whether your text and background color combination meets WCAG 2.1 accessibility standards. Shows contrast ratio and pass/fail for AA (4.5:1) and AAA (7:1) levels.
FAQ
What is WCAG?
The Web Content Accessibility Guidelines (WCAG) are international standards for making web content accessible to people with disabilities, including color vision deficiencies.
What contrast ratio do I need?
WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18px+ bold or 24px+). AAA requires 7:1 for normal and 4.5:1 for large.
Why does color contrast matter?
Low-contrast text is hard to read for people with low vision, color blindness, or in bright sunlight. It also affects your legal compliance in many jurisdictions.
さらに探す
おすすめのその他の 開発者ツール…
JSONフォーマッター
構文ハイライトとエラー検出でJSONを整形、検証、圧縮
Base64エンコーダー/デコーダー
テキストやファイルをBase64にエンコードし、Base64文字列を読めるテキストにデコード
URLエンコーダー/デコーダー
URLコンポーネントとクエリ文字列パラメータをエンコード・デコード
UUIDジェネレーター
ランダムUUID（v1、v4）を生成するか、複数のUUIDを一括生成
ハッシュジェネレーター
テキストやファイルからMD5、SHA-1、SHA-256、SHA-512ハッシュを生成
正規表現テスター
リアルタイムのマッチハイライトとグループ抽出で正規表現をテスト
JWTデコーダー
JSON Web Tokenをデコードして検査 — ヘッダー、ペイロード、署名を確認
HTMLフォーマッター
適切なインデントと構文ハイライトでHTMLコードを整形・美化