What contrast ratio is required for WCAG AA?

WCAG 2.1 Level AA requires a minimum contrast ratio of 4.5:1 for normal text (under 18pt or 14pt bold) and 3:1 for large text (18pt+ or 14pt+ bold). UI components and graphical elements also need 3:1.

WCAG Level AAA is the highest accessibility standard. It requires 7:1 for normal text and 4.5:1 for large text. AAA is the recommended target for critical content such as emergency information.

Does it work on mobile?

Yes. The checker works in any modern mobile browser. All calculations are done instantly in JavaScript — no server, no upload, no lag.

颜色对比度检查器

检查前景与背景颜色的 WCAG 2.1 对比度比例,实时显示 AA/AAA 通过与否。

100% client-side · no upload

Foreground color

Background color

Normal text sample

Large text sample

Contrast ratio

21:1

How to use the contrast checker

Enter or pick your foreground (text) color.
Enter or pick your background color.
Read the contrast ratio and WCAG pass/fail badges instantly.

Common use cases

Accessibility audit: Verify text meets WCAG AA before shipping.
Brand color review: Check if your brand palette is accessible on white and dark backgrounds.
Button design: Ensure CTA button labels pass 3:1 for UI components.

常见问题

What contrast ratio is required for WCAG AA?: WCAG 2.1 Level AA requires a minimum contrast ratio of 4.5:1 for normal text (under 18pt or 14pt bold) and 3:1 for large text (18pt+ or 14pt+ bold). UI components and graphical elements also need 3:1.
What is WCAG AAA?: WCAG Level AAA is the highest accessibility standard. It requires 7:1 for normal text and 4.5:1 for large text. AAA is the recommended target for critical content such as emergency information.
Does it work on mobile?: Yes. The checker works in any modern mobile browser. All calculations are done instantly in JavaScript — no server, no upload, no lag.

Last updated: 2026-05-20 By jarvisbox