CodePark/ questions / Contrast, motion & zoom
START PRACTICINGPRACTICE
Frontend question · Accessibility › Contrast, motion & zoom

In a form, invalid fields are shown only by turning their border red. There is no icon and no text. Which WCAG problem is this?

It fails Use of Color (1.4.1): colour must not be the only way to show information

WCAG 1.4.1 Use of Color is a level A rule. Colour must not be the only way to show information. Users with colour blindness may not see red, and screen readers don't announce border colours. Add an error icon and text, and set aria-invalid="true".

"It's fine with 4.5:1 contrast" is the tempting wrong answer. Contrast is a separate rule. Good contrast doesn't help someone who can't tell red from grey. Also, UI parts like borders that show state need 3:1 contrast under 1.4.11 Non-text Contrast, but that doesn't fix the colour-only problem.