◐

Developer guide

4.5:1 Contrast Ratio Explained

Understand when 4.5:1 applies to normal text and how to check a foreground and background pair.

Short answer

A 4.5:1 contrast ratio is the WCAG AA minimum for normal-size text against its background.

When this applies

It applies to normal text in WCAG 2.x. Large text can use the lower 3:1 AA threshold, but thin or borderline-sized text should be treated as normal text.

Practical review steps

  1. Use the actual foreground and background colors, including opacity.
  2. Check hover, focus, error, and disabled states as separate pairs.
  3. Review the pair in the final font size and weight, not only as a swatch.

Check the actual color pair

Use the free Contrast Check with the foreground and background colors from the real component. It provides an immediate AA and AAA ratio check in the current browser tab.

Source and limit

For the formal requirement, review W3C's WCAG contrast minimum guidance. A ratio result checks a color pair; it is not a complete accessibility audit.