The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):
User Interface Components
Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.
Questions & Answers
The UI components on my page receive a visible indication of focus but the visible focus indicator is not native. What are the contrast requirements for visible focus states?
- non-text contrast
- UI components
Do vector graphics in animated videos need to follow color contrast guidelines?
I have a dropdown list with black text in a form. Does the background bar on the hover states as you hover over each selection option require a 3.1 contrast ratio against the white container background, or can I use a light gray background bar...
- hover state
Can I just add a "high contrast mode" to my app take care of all of my contrast issues?
- color blind
- high contrast mode
I want to implement a video (that does not contain audio) as the hero banner of my site. If I include a pause button, am I violating any accessibility guidelines to have it set on auto play?
Does there need to be a visible indication of focus when there's a text pointer?
- contrast ratios
I'm working on updating my focus, mouseover (hover) & select (active) states and want to make sure that my new design meets contrast requirements. What are the contrast requirements for these different states?
I want to make sure that my site uses proper contrast ratios. Are there different contrast ratio requirements for text and for UI elements?
- contrast ratios
The company colors don't pass contrast guidelines, and the entire site is built on that color scheme. Are there any exceptions to this rule, and if so, what would you suggest?