Journal · Brand
Light gray text looks expensive and nobody can read it
Light gray body text fails the 4.5-to-1 contrast minimum on 83.9 percent of the web's top million home pages, which makes it the most common and the cheapest-to-fix design failure a small business has.
A woman ahead of me at the butcher counter in Irvington held her phone out at arm's length, tilted it toward the window, then gave up and asked the guy behind the case what time they close on Sunday.
She was on their website. The hours were on her screen. She could not read them.
The text was gray. Not dark gray. That soft, expensive-looking gray that has been on every website since about 2015. On a phone in August daylight it may as well have been blank.
In February 2026, WebAIM ran an automated scan across the top one million home pages on the internet. 83.9 percent of them had text with too little contrast against its background. That makes it the most common accessibility failure on the web, ahead of missing image descriptions (53.1 percent) and unlabeled form fields (51 percent). It is also the cheapest to fix. You change a color.
Why does every website use light gray text?
Because it looks good in the studio.
Your designer builds the site on a calibrated monitor at full brightness with the blinds down. Gray on white reads as calm in that room. Restrained. It is the visual equivalent of not raising your voice, and for about ten years that has been the default sound of a professional website.
Then a woman in her sixties opens it one-handed on a four-year-old Android in a parking lot.
Most of the time nobody chose the gray at all. It arrived with the theme. Template body copy, form placeholder styles, footer text, caption presets in design tools, all of it skews light, because light gray photographs beautifully in a template preview and template previews are what sell templates.
Nobody chose that gray. It came with the template. Your customers over fifty have been paying for it ever since.
What contrast ratio does your text actually need?
The measure comes from WCAG 2.2, success criterion 1.4.3. Normal body text needs a contrast ratio of at least 4.5 to 1 against whatever sits behind it. Large text gets a break at 3 to 1, where large means 18 point and up (roughly 24 pixels) or 14 point bold.
Ratios stay abstract until you put hex codes next to them. Every gray a template is likely to hand you, measured on a white background:
| Gray | Contrast on white | Passes 4.5:1 |
|---|---|---|
#CCCCCC |
1.6 to 1 | No |
#AAAAAA |
2.3 to 1 | No |
#999999 |
2.8 to 1 | No |
#888888 |
3.5 to 1 | No |
#777777 |
4.48 to 1 | No, by two hundredths |
#767676 |
4.54 to 1 | Yes, barely |
#666666 |
5.7 to 1 | Yes |
#767676 is the lightest gray you can set on white and still pass. One hex step lighter, #777777, and you fail. I think about that gap more than is reasonable.
Then check where your grays live. A physical therapy clinic in Fishers I looked at this spring had good dark body copy everywhere, and then a contact form whose placeholder text (Your name, Best number to reach you) sat at roughly #AAAAAA. Older patients kept sending the form in with fields empty. They never saw the prompts.
Can a shop get sued over text color?
Not over the color by itself. Over the page it makes unreadable, yes, and it happens at volume.
Plaintiffs filed 4,928 web accessibility lawsuits in 2025, then 363 more in June 2026 alone. Insufficient color contrast turns up in those complaints next to missing keyboard navigation and unlabeled menus.
The law is worth stating precisely, because plenty of people selling compliance do not. The Justice Department has never issued a web accessibility regulation for private businesses. The April 2024 rule naming WCAG 2.1 Level AA covers state and local government, and in April 2026 the department pushed those deadlines out to 2027 and 2028. Your shop falls under Title III, which requires equal access without naming a number. Courts have filled that silence with WCAG anyway. So the standard a butcher in Irvington gets measured against is the one his template ignored.
Does an accessibility widget fix it?
No, and the docket says so.
Of the 363 suits filed in June 2026, 97 defendants were already running a third-party accessibility widget. More than a quarter of them. Those shops had the little icon in the corner, the one that opens a panel with a contrast toggle and a font slider, live on the site when the complaint arrived.
An overlay does not change your text color. It offers your visitor a button that will change it for them, assuming they spot the button, understand what it does, and feel like doing homework to find out when you close. Almost nobody does that. The widget bills you every month and the gray stays gray.
Darkening the text costs nothing per month.
Four things to do this week
- Open your own website on your own phone, standing outside, in daylight. Not on the laptop in your office. Contrast problems are invisible on a bright screen in a dim room.
- Screenshot it. Find the lightest text on the page, then put that color and its background into WebAIM's contrast checker. Free, browser-based, about fifteen seconds per pair.
- If it fails, darken the text instead of enlarging it. In Squarespace, Wix, Shopify and WordPress this is a theme color setting, not code.
#333333is a safe body color. Save#767676for fine print you would not mind someone skipping. - Look at the three places templates always get wrong: placeholder text inside forms, footer text, and any pale text laid over a photograph.
The butcher's hours page got darker a few weeks later, and not because of anything I said. His daughter runs the Instagram, and she told him the site looked broken on her phone. She was close. It looked fine. It could not be read, which for a page whose whole job is telling people when you are open comes to the same thing.
Sources
| # | Source | What it backed up |
|---|---|---|
| 1 | The WebAIM Million, February 2026 | 83.9% of the top one million home pages have low-contrast text; 53.1% missing alt text; 51% missing form labels; 56.1 errors per page. |
| 2 | WCAG 2.2 Understanding SC 1.4.3: Contrast (Minimum) | The 4.5:1 ratio for normal text, 3:1 for large text, and the 18pt / 14pt bold definition of large. |
| 3 | UsableNet ADA web accessibility lawsuit tracker | 4,928 suits filed in 2025; 363 in June 2026; 97 of those defendants running an accessibility widget. |
| 4 | Ogletree Deakins on the DOJ Title II final rule | No DOJ web rule exists for private businesses under Title III; WCAG 2.1 AA is the courts' de facto benchmark. |
| 5 | WebAIM Contrast Checker | The free tool for checking a foreground and background pair against AA and AAA. |