TechCompare LogoTechCompare

What is WCAG AA contrast? The 4.5:1 ratio requirement explained for body text

Always meet WCAG AA for body text. It's not aspirational. It's the floor. Use a contrast checker during design, not as an afterthought. If your brand palette doesn't have accessible text-background pairings, create accessible variants for your digital products.

WCAG AA sets a 4.5:1 minimum contrast ratio for normal text (under 18pt or 14pt bold) against its background. It's a widely used web accessibility benchmark. Whether a law or procurement rule requires WCAG depends on the jurisdiction, organization, and service.

By TechCompare · Updated

WCAG level
WCAG AA
Minimum contrast (4.5:1+)
Example ratio
4.5:1
#767676 on #FFFFFF
Category
WCAG Levels
Accessibility knowledge base
This exact #767676 on #FFFFFF pair, pre-loaded. Edit either color, see the live WCAG ratio, or compare a second pair.
Edit in the full tool

How this is calculated

A contrast ratio of 4.5:1 means the lighter color is 4.5 times as bright as the darker color, as measured by the WCAG relative luminance formula. Pure black (#000000) on pure white (#FFFFFF) has a ratio of 21:1, the maximum. A medium gray (#767676) on white has a ratio of 4.54:1, barely passing. Designers often push body text lighter for aesthetic reasons ("it looks cleaner"), but anything below 4.5:1 fails WCAG AA for normal text and can be harder to read, especially for people with low vision or in bright ambient light. Actual readability also depends on font size, weight, rendering, and context.

Verdict

WCAG AA sets normal text contrast at 4.5:1 using the relative luminance formula (L1 + 0.05) / (L2 + 0.05), where L1 is the brighter color and L2 the darker. Pure black on white reaches 21:1, while #767676 on white rounds to 4.54:1, just above the threshold. WCAG is a common accessibility benchmark, but laws and procurement rules adopt it within specific scopes. Validate text and background pairs during design rather than retrofitting after the palette ships.

More Contrast scenarios

WCAG AAA for normal text
WCAG AAA requires a minimum contrast ratio of 7:1 for normal text, nearly double the AA requirement.
View details ➜
Text on background images
Text over a background image can be hard to check because image brightness varies across the surface.
View details ➜
Building accessible palettes
Building an accessible color palette means defining text and background color pairs that pass WCAG AA from the start, rather than retrofitting contrast after design.
View details ➜

Related guides

WCAG AAA for normal text
The next-tier accessibility standard above AA.
View guide ➜
Building accessible palettes
How AA pairs scale into a full accessible palette.
View guide ➜

Frequently asked questions

What's the difference between WCAG AA and AAA?
AA sets 4.5:1 for normal text, while AAA sets 7:1. WCAG is widely used, but whether either level is legally required depends on the law and organization that applies to the service. Many sites use AA as their target.
How do I calculate the 4.5:1 contrast ratio between two colors?
Use the WCAG relative luminance formula. Convert each color to its relative luminance (a weighted sum of the sRGB channels). The contrast ratio is (L1 + 0.05) / (L2 + 0.05), where L1 is the brighter color and L2 the darker. The result must be >= 4.5 for normal text (< 18pt or 14pt bold).
Which color pairs pass WCAG AA for 4.5:1 body text?
Pure black (#000000) on pure white (#FFFFFF) gives 21:1. Dark text on light backgrounds is the safe pattern. A medium gray (#767676) on white rounds to 4.54:1, barely passing. Common failures include light gray on white (often ~2.5:1) and brand colors that look fine in isolation but fail at body text sizes.

Related tools

Color Picker

Pick colors and convert between HEX, RGB, HSL, CMYK, and HSV formats.

Use tool ➜

JSON Formatter

Validate, format, and minify JSON data with readable output and error detection.

Use tool ➜

Aspect Ratio Visualizer

Visually compare width differences between 16:9, 21:9, and 32:9 monitors.

Use tool ➜