Success Criteria

WCAG 1.4.1 Use of Color

Success Criterion 1.4.1 requires that color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. It's a Level A criterion under Guideline 1.4 (Distinguishable).

Why color-only signals fail

Roughly 1 in 12 men and 1 in 200 women have some form of color vision deficiency — red-green colorblindness being the most common. For them, a signal that depends entirely on distinguishing one color from another (red versus green, in particular) may be genuinely imperceptible, not just harder to see. This is distinct from 1.4.3 Contrast, which is about how much contrast a color has against its background — 1.4.1 is about whether color is the only channel carrying meaning at all, regardless of contrast ratio.

A link embedded in a paragraph of body text, distinguished from surrounding text only by a different (but similarly-weighted) color, with no underline or other non-color cue — someone who can't distinguish the two colors has no way to tell which words are clickable.

Other common patterns

  • Form validation states shown only by a red or green border, with no icon or text message
  • Charts and graphs where data series are distinguished only by color, with no pattern, label, or legend readable independent of color
  • Required-field indicators using only a colored asterisk or colored label text with no additional symbol or wording
  • Status indicators (a colored dot for online/away/offline) with no accompanying text or icon shape difference

The fix pattern

Pair every color-coded signal with a second, non-color cue: an icon, an underline, a text label, a pattern or texture, a shape difference. A red error border paired with an error icon and a text message satisfies the criterion even for someone who can't perceive the red at all.

Common questions

What is WCAG 1.4.1 Use of Color?
A Level A criterion: information conveyed with color must also be available through another visual cue, so colorblind users don't miss it.
What is a common violation?
Marking required fields or errors in red only, or showing a link distinguished from surrounding text by color alone with no underline.
How do I fix a 1.4.1 issue?
Pair color with text, icons, patterns, or underlines — for example add an asterisk and label to required fields, and underline in-text links.

Want to see how your own site scores?

Run a free accessibility scan