WCAG 1.4.3 Contrast (Minimum) requires that text — and pictures of text — stand out clearly from their background. Specifically, normal text must reach a contrast ratio of at least 4.5:1, and large text at least 3:1, so people with moderately low vision can read it without contrast-enhancing assistive technology.

What success criterion 1.4.3 actually says

The normative wording from the W3C Web Accessibility Initiative is precise: “The visual presentation of text and images of text has a contrast ratio of at least 4.5:1,” with two relaxations and three exceptions.

  • Normal text: 4.5:1. Anything below 18pt (≈24px), or below 14pt bold (≈18.5px), must hit this ratio.
  • Large text: 3:1. Text at 18pt+ or 14pt bold+ gets the relaxed ratio because bigger letterforms stay legible at lower contrast.
  • Incidental (exempt): text in an inactive UI component, pure decoration, text invisible to everyone, or text that’s part of a picture containing significant other visual content.
  • Logotypes (exempt): text that is part of a logo or brand name has no contrast requirement.

“Contrast ratio” is a calculated value between 1:1 and 21:1, derived from the relative luminance of the two colors via the formula (L1 + 0.05) / (L2 + 0.05). Because it weighs luminance rather than hue, the test still works for people who don’t perceive color the way most do. Note what 1.4.3 does not cover: button borders, icons, input outlines, and focus rings are non-text and belong to 1.4.11 Non-text Contrast (3:1), not here.

Who 1.4.3 protects

The W3C states the intent plainly: enough contrast “so that it can be read by people with moderately low vision … without contrast-enhancing assistive technology.” The people who depend on this criterion include:

  • People with low vision who can read text but with reduced contrast sensitivity, often without using a screen reader at all.
  • People with color vision deficiency (color blindness), who rely on luminance difference rather than hue to separate text from background.
  • Anyone with age-related vision loss, a fast-growing group as the population ages.
  • Situationally impaired users — a phone in direct sunlight or a cheap monitor can drop perceived contrast for anyone.

Crucially, these users frequently don’t use JAWS, NVDA, or VoiceOver. Low contrast is a barrier no screen reader fix can solve; the only remedy is changing the colors themselves.

Concrete failures and how to fix them

The two failures the W3C catalogs here are F24 (setting a foreground color without a background, or vice versa, so a user’s defaults collide) and F83 (a background image that leaves text unreadable). On real small-business sites, those show up as:

Light-gray helper and placeholder text. A trendy #999 on white measures about 2.85:1 — a clear fail for body-size text. Darken it:

/* Fails 1.4.3: 2.85:1 on #fff */
.form-hint { color: #999999; }

/* Passes: #595959 reaches 7:1 on #fff */
.form-hint { color: #595959; }

Pastel brand buttons with white labels. A mid-tone brand color (say #4aa3ff) with white text often lands near 2.4:1. Keep the bright shade for large decorative areas, but define a darker text-safe token for anything users must read:

.btn-primary { background: #1366c4; color: #fff; } /* ≈5.1:1, passes */

Headline text laid directly over a hero photo. This is failure F83. The background luminance changes pixel by pixel, so part of the headline may pass and part may fail. Add a scrim:

.hero-overlay { background: linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)); }

Remember the exceptions: a disabled “Submit” button that’s intentionally grayed out is exempt, and your logo’s wordmark is exempt. Don’t waste effort “fixing” those — and don’t gray out active controls thinking it grants an exemption, because it doesn’t.

How to test for 1.4.3

You can verify most of a site in an afternoon by pairing an automated pass with targeted manual checks.

  1. Grab the color pair. Note the text hex and the background hex behind it.
  2. Run it through a checker. The WebAIM Contrast Checker returns the exact ratio and pass/fail for both text sizes; browser DevTools show it right in the color picker.
  3. Confirm the text size. Decide whether each pair is “normal” (4.5:1) or “large” (3:1) before you judge it — a borderline 3.2:1 passes for a 24px heading and fails for 16px body copy.
  4. Test real states. Hover, focus, visited links, placeholder text, error messages, and disabled-but-readable text are all separate measurements.
  5. Check text over images and gradients by hand. Automated scanners go blind here because they can’t sample a moving background — this is exactly where F83 hides.

Automated tools alone are not enough. WebAIM’s Million report detects low-contrast text on roughly 79% of the top one million home pages — about 30 distinct instances per page — so scanners catch the obvious cases while subtler ones (text on imagery, hover states) still need a human eye. That’s why thorough work pairs tooling with a full accessibility audit, and why color contrast is usually the highest-volume fix on any project.

Low-contrast text is consistently the most common error WebAIM detects — and that prevalence is exactly what makes it a litigation magnet. A plaintiff’s tester needs only a free browser extension to screenshot a failing ratio, so contrast routinely appears in ADA demand letters.

The volume is not trivial. Plaintiffs filed more than 4,000 digital-accessibility lawsuits in 2024, and roughly two-thirds targeted businesses with under $25 million in revenue, per UsableNet’s 2024 year-end report — small companies, not just retail giants. U.S. courts and the DOJ treat WCAG 2.1 AA as the practical benchmark for an accessible website under ADA Title III, and 1.4.3 is one of the AA criteria it includes.

A warning on shortcuts: UsableNet found about a quarter of 2024 lawsuits named an accessibility overlay or widget as part of the barrier, not the solution. A “high contrast” toggle bolted on by an overlay doesn’t make your default design pass 1.4.3 — the user has to find and enable it, and most never do. We’re deliberately anti-overlay and fix the actual CSS instead.

This page is general information, not legal advice. For your specific exposure, consult a qualified attorney.

Fixing 1.4.3 without losing your brand

Passing 1.4.3 almost never means abandoning your palette. In practice, [EXPERT_NAME] and the [AGENCY_NAME] team:

  • Adjust shade, not hue — nudge a brand color darker for text use while keeping the vivid version for large graphics, which are exempt or only need 3:1.
  • Split each brand color into a text-safe token and a decorative token so a designer can’t accidentally ship the failing one as body copy.
  • Add scrims or solid panels behind any text that sits on photography.

Curbcut does this as hands-on code work for small businesses — manual accessibility remediation, never a widget. If you’d rather not measure every color pair yourself, run a free scan and we’ll show you exactly which text fails 1.4.3, then correct it in your stylesheet.