Color Contrast - Choose Color with Care
The most common form of color deficiency, red-green color deficiency, affects approximately 8% of the population. Using ONLY colors such as these (especially to indicate required fields in a form) will make it more difficult for some visitors to your site to understand the meaning and messaging of your site. Depending on the sites construct it could create roadblocks in performing certain activities on your pages.
Other groups of people with disabilities, particularly users with learning disabilities, benefit greatly from color when used to distinguish and organize your content.
Be especially careful with light shades of gray, orange, and yellow.
To satisfy both groups, use color, but also be sure to use other visual indicators, such as an asterisk for required form fields. Be sure to also distinguish blocks of content from one another using visual separation (such as white space or borders).
- UA Brand Color Guide showing accessible options (scroll to the "Text color accessibility test")
- WCAG 2.0: Use of Color
- WebAIM: Color Contrast checker
- WebAIM: Color-Reliant Link Contrast Checker
- Adobe Illustrator CC - Color blindness filters
- Color Safe
- Who can use this color combination?
- Color Oracle Java App
- Color - Oregon State University
- Article: Inclusive Color Palettes for the Web: My mission to create color palettes that are appealing AND accessible
- Article: Color and Contrast in E-Learning Design: A Review of the Literature and Recommendations for Instructional Designers and Web Developers (PDF)
- Article: Guide to Color Contrast and Conversion Rates
- Article: A guide to color accessibility in product design