Color Contrast Checker

A contrast ratio measures the difference in relative luminance between two colors on a scale from 1:1 (identical colors) to 21:1 (pure black on pure white). WCAG 2.1 uses this ratio to set minimum readability thresholds for text and UI elements so that people with low vision or color blindness can perceive content reliably.

For text contrast, Level AA requires 4.5:1 for normal text and 3:1 for large text. Level AAA requires 7:1 and 4.5:1 respectively. WCAG conformance and legal obligations depend on the applicable standard and jurisdiction; AAA is not automatically required for government portals.

WCAG defines large text as 18 pt (about 24 px) or larger at a normal weight, or 14 pt (about 19 px) or larger when bold. Larger glyphs are easier to distinguish at lower contrast, so the thresholds for large text are more lenient than those for body copy.

WCAG 2.1 success criterion 1.4.11 sets a 3:1 minimum for non-text elements such as form field borders, icon strokes, focus rings, and chart lines. The UI result tells you whether your color pair is safe for those graphical objects independently of whether it passes for text.

Sufficient contrast helps people with low vision or reduced contrast sensitivity read text and distinguish controls. A passing ratio addresses only specific WCAG contrast criteria. It does not establish full WCAG conformance or legal compliance, which also depends on content, interactions, exceptions, jurisdiction, and the applicable standard.