colorcode.tools
Home / Glossary / Contrast Ratio

Contrast Ratio

A numeric measure (1:1 to 21:1) of the brightness difference between two colors, used to assess text legibility.

Definition

A contrast ratio quantifies how distinguishable two colors are when placed adjacent — typically text against its background. The ratio compares the relative luminance of the lighter color to the darker. A ratio of 1:1 means identical brightness (invisible text). 21:1 is pure black on pure white. WCAG AA body text requires at least 4.5:1; AAA requires 7:1.

Formula

Contrast = (L_lighter + 0.05) / (L_darker + 0.05). Each L is computed via the WCAG sRGB luminance formula.

Example

Text at #888 on white = 3.5:1 (Fail AA for body). Text at #555 on white = 7.4:1 (AAA). Text at #FFF on #008080 (teal) = 4.5:1 (just passes AA).

Related tools

Contrast checkerAccessible color generator

Related terms

WCAG (Web Content Accessibility Guidelines)
The W3C standard for digital accessibility, including the co
Relative Luminance
A weighted measure of perceived brightness on a 0-1 scale, u