Color & design

Text contrast checker

Compare two opaque HEX colors against WCAG text contrast thresholds.

Processed locally

Checks text contrast only, not complete accessibility. Solid opaque colors only; no transparency, gradients or images.

Your answer will appear here.

Help and method

WCAG 2.2 uses relative sRGB luminance: (lighter + 0.05) / (darker + 0.05). AA requires 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1 and 4.5:1. Large text starts at 18 pt (24 CSS px), or 14 pt bold (about 18.67 CSS px). Pass/fail uses the unrounded ratio, not the displayed rounding.

WCAG 2.2 · 1.4.3 WCAG 2.2 · 1.4.6 Methods and reliability

Worked example

An example you can try or adapt to your own values.

Text color (HEX): #000000
Background color (HEX): #ffffff

Result

Contrast ratio: 21:1; AA · normal text: Pass; AA · large text: Pass; AAA · normal text: Pass; AAA · large text: Pass

Worked example

Result

Useful next