WCAG 1.4.11
Level AA
Perceivable
1.4.11 Non-text Contrast
UI components and meaningful graphics have at least 3:1 contrast against adjacent colours.
What 1.4.11 Non-text Contrast means
Buttons, form borders, focus indicators and icons are visible to low-vision users.
How to test
Measure contrast of control boundaries, states and informative icons — must be 3:1+.
How to meet it
Increase the contrast of borders, focus rings, icons and active states to meet 3:1.
Need help meeting 1.4.11?
Our IAAP-certified team audits your website and apps against every WCAG 2.2 criterion and delivers code-level remediation.
Official reference: Understanding 1.4.11 Non-text Contrast (W3C)
More Perceivable criteria
1.1.1 Non-text Content
1.2.1 Audio-only and Video-only (Prerecorded)
1.2.2 Captions (Prerecorded)
1.2.3 Audio Description or Media Alternative (Prerecorded)
1.2.4 Captions (Live)
1.2.5 Audio Description (Prerecorded)
1.3.1 Info and Relationships
1.3.2 Meaningful Sequence
1.3.3 Sensory Characteristics
1.3.4 Orientation
1.3.5 Identify Input Purpose
1.4.1 Use of Color
1.4.2 Audio Control
1.4.3 Contrast (Minimum)
1.4.4 Resize Text
1.4.5 Images of Text
1.4.10 Reflow
1.4.12 Text Spacing
1.4.13 Content on Hover or Focus