Check WCAG contrast ratios instantly — AA & AAA for any two colors
The quick brown fox jumps over the lazy dog
Normal-size body text: Accessibility matters. WCAG 2.2 defines contrast standards to ensure readable text for all users, including those with low vision.
#1a1a2e on #ffffff
WCAG Contrast Ratio
17.06:1
Excellent — AAA
WCAG 2.2 Compliance
Large text = 18pt (24px) normal weight or 14pt (18.67px) bold.
AA is the minimum legal standard in many jurisdictions. AAA is the enhanced (recommended) standard.
UI components includes input borders, focus rings, icons, and other non-text visual indicators.
The Color Contrast Checker lets you instantly test any foreground and background color pair against WCAG 2.2 accessibility standards. Enter hex values or pick colors visually, and see the precise contrast ratio alongside clear AA and AAA pass/fail results for normal text, large text, and UI components — no signup, no installs, completely free.
For normal-sized body text (below 18pt / 24px), you need a minimum contrast ratio of 4.5:1 for WCAG AA. Large text (18pt+ or 14pt+ bold) and UI components like input borders and icons require at least 3:1.
AA is the standard legal minimum in most jurisdictions — 4.5:1 for normal text, 3:1 for large text. AAA is the enhanced level — 7:1 for normal text, 4.5:1 for large text — recommended for maximum readability, especially for users with low vision.
The WCAG contrast formula works on opaque, fully-rendered colors. Enter the final rendered hex color (e.g. the result of compositing a semi-transparent color onto its background) for an accurate result.
The ratio is computed using the WCAG 2.x relative luminance formula: each RGB channel is linearised and combined as L = 0.2126R + 0.7152G + 0.0722B. The ratio is then (L_lighter + 0.05) / (L_darker + 0.05), giving a value between 1:1 (no contrast) and 21:1 (black on white).