Does dynamically changing text color meet accessibility requirements?
Question
Answer
The text contrast behavior you describe sounds like it would technically meet WCAG’s color contrast requirements, since there is a mechanism to adjust the text to reach minimum contrast, but there are a few things to keep in mind.
The user must be able to scroll to bring all text on the page to minimum contrast in the following scenarios:
- When the user is scrolling using keyboard alone
- When the user increases font size by 200%
- When the user zooms the browser to 400% (starting at 1280 CSS pixels wide & 1024 CSS pixels high, or equivalent to 320 CSS pixels wide and 256 CSS pixels high)
In terms of user experience, consider providing a way for users to turn off the color changing behavior so that all visible text reaches minimum contrast. While this interactive text color change may be technically conforming, some users are likely to either miss the method for increasing contrast or to miss the low-contrast text entirely.
For additional help reviewing color contrast of text, graphics, and more, explore the WCAG Color Contrast Checker from Accessible Web.
