How to fix low color contrast

WCAG: 1.4.3 Contrast (Minimum) (Level AA) · Updated October 14, 2026

Low contrast makes text hard to read for people with low vision, color vision deficiencies, aging eyes, or anyone using a phone in sunlight. It is usually the most frequent issue on small-business sites.

The numbers

• 4.5:1 for normal text.
• 3:1 for large text: at least 24px regular or 18.66px (14pt) bold.
• Logos and purely decorative text are exempt. Disabled controls are exempt, but placeholder text that conveys instructions is not.

Common failures and fixes

• Light gray on white. #999 on white is only 2.8:1. #767676 is the lightest gray that passes on white (4.54:1); #595959 gives more headroom (7:1).
• White text on a bright brand color. Darken the button color a few shades, or switch to dark text.
• Text over photos. Add a solid or semi-opaque overlay behind the text, or move the text out of the image.
• Placeholder text. Browser defaults are often too light. Better: use a real label above the field.
• Hover and focus states. Check them too; a scan only sees the default state.

.muted { color: #595959; }              /* 7:1 on #fff */
.btn   { background: #0060c7; color: #fff; } /* 5.9:1 */
.hero-text { background: rgba(0,0,0,.6); color: #fff; }

Keeping your brand

You rarely need a new palette. Keep the brand color for large elements and backgrounds, and introduce one darker shade of it for text and small buttons.

Step by step

1. List failing colors. Scan the page and note each text and background pair flagged by color-contrast.
2. Pick passing shades. Use a contrast checker to find the nearest shade that reaches 4.5:1 (or 3:1 for large text).
3. Update your styles. Change the color variables in your theme or CSS rather than one element at a time.
4. Check states. Verify hover, focus, visited and placeholder colors, then re-scan.

Automated accessibility scan. Results are informational and may not identify every accessibility issue. This service is not legal advice, a compliance certification, or a substitute for comprehensive manual accessibility testing.