What contrast measures
Contrast ratio compares the lightness of text against its background, expressed as a ratio from one to one up to twenty one to one. Higher numbers mean more separation and easier reading. Guidelines set minimum ratios so text remains legible for low vision users and on bright screens.
- Normal text needs a ratio of at least four and a half to one.
- Large text can pass at three to one because bigger shapes are easier.
- Pure ratios ignore hue so two colors of similar lightness fail even if hues differ.
Where it applies
Contrast rules cover more than body copy.
- Meaningful icons and graphics often need at least three to one.
- Focus indicators and form borders should be distinguishable too.
- Text over images needs a solid or shaded backing to stay legible.
Checking and fixing
- Measure pairs with a contrast tool rather than guessing by eye.
- Adjust lightness, not just hue, since lightness drives the ratio.
- Never use color as the only signal, since contrast does not convey meaning by itself.
Large text is commonly defined as bold around eighteen pixels or regular around twenty four pixels, where the lower threshold applies.
Key idea
Contrast ratio measures lightness difference between text and background, and meeting the four and a half to one threshold keeps normal text readable.