Light grey text on white looks clean in a design file. It's also one of the most common accessibility failures on the web, and it's easy to miss because it looks fine on your own bright screen.

Here's the thing: you don't need to guess a darker shade. Chrome DevTools will measure the contrast and suggest a color that passes.

The numbers you're aiming for

WCAG, the standard most accessibility checks use, measures contrast as a ratio between text color and background. WCAG's contrast guidance sets these levels:

Level Normal text Large text

AA (the usual target) 4.5:1 3:1

AAA (enhanced) 7:1 4.5:1

To make this concrete, I calculated a few common greys on a white background:

Text color on #FFFFFF Ratio Result

#9e9e9e 2.68:1 Fails

#767676 4.54:1 Passes AA

#595959 7.00:1 Passes AAA

That #9e9e9e is a very popular "subtle" grey. It fails.

Fixing it in DevTools

These steps follow Chrome's contrast documentation :

Inspect the text. Right-click it and choose Inspect .…