The Contrast Rule That Applies to Icons and Focus Rings, Not Text
A design review flags a form field's border and a row of small status icons — none of it is text, but a reviewer insists it's still bound by a WCAG contrast rule of its own.
Which minimum ratio covers non-text UI components and graphical objects under WCAG 2.1 AA?
The correct answer is "3:1 (SC 1.4.11)."
SC 1.4.11, Non-text Contrast, requires a 3:1 minimum for UI components and graphical objects that convey information — icons, form field borders, focus indicators, chart elements — any non-text element a user needs to perceive to operate the interface. This is a separate check from text contrast and has to be verified on its own.
4.5:1 (SC 1.4.3) is the text-contrast minimum, not the UI-component one. 7:1 is an AAA-level text target. "No minimum — exempt" is wrong for operable UI components; only specific cases like disabled controls or logos are exempt.
Share this question