color-contrast · WCAG 1.4.3 Contrast (Minimum) · Level AAHow to fix the “color-contrast” accessibility issue
The axe-core color-contrast rule fails when text does not have enough contrast against its background. Under WCAG 2.2 AA, normal text needs a contrast ratio of at least 4.5:1 and large text at least 3:1 — a requirement German BFSG and EU EAA enforcement both rest on via EN 301 549.
What axe-core checks
axe-core computes the contrast ratio between each text node's color and its effective background color, and fails any normal-size text below 4.5:1 (or large text — 18.66px bold / 24px — below 3:1). It is one of the most common failures on real e-commerce sites.
Which standard this maps to
| WCAG 2.2 | 1.4.3 Contrast (Minimum) (Level AA) |
| EN 301 549 | 9.1.4.3 |
| BFSG / EAA | BFSG § 12 via EN 301 549 · EAA Annex I |
| Category | Color & Contrast |
Why it matters
Low contrast is the single most frequent WCAG failure, and it directly affects users with low vision and anyone on a bright screen outdoors. For a German shop, it is also the easiest violation for an Abmahnung to cite, because it is objectively measurable — there is no argument about a 3.1:1 ratio.
Common causes
- Light-grey body text (e.g.
#999) on white - Brand-coloured buttons where the label fails against the fill
- Placeholder text in form fields
- Text over a busy image or gradient without a scrim
How to fix it
Raise the contrast until the ratio passes. The darkest grey that still passes on white is about #767676 (4.54:1). Check pairs with a contrast checker or your browser DevTools.
/* Fails: 2.85:1 */
color: #999999;
background: #ffffff;
/* Passes AA: 4.54:1 */
color: #767676;
background: #ffffff;FAQ
4.5:1 for normal text and 3:1 for large text (at least 24px, or 18.66px bold).
No — WCAG exempts disabled controls and pure decoration, and axe-core does not flag them.
Find every issue like this on your site
Run a free WCAG 2.2 AA scan — real axe-core engine, no signup. Or get a timestamped evidence report for €29.