Web Accessibility Policy of the State of Maine

Back to Policy Table of Contents

Implementation Guidelines

3. Colors

3.1 - Do not convey information with color alone.

What:
Color is often used to indicate special functions or status. For example, required form fields are frequently indicated with red labels.

Why:
Users with blindness, limited vision, or color-blindness may miss information presented with color.

How:
Whenever color is used as an indicator, use a non-color-based indicator as well. For example, required form fields could be identified with asterisks as well as color.

Ref: WCAG 2.1; 508 c

3.2 - Use contrasting foreground and background colors.

What:
Web authors can set specific colors to be used for foregrounds (text) and backgrounds. Sometimes images are used as backgrounds.

Why:
Users with limited vision or color-blindness may have difficulty reading text that is similar in color to its background.

How:
For text, use dark colors on light backgrounds, or vice versa. Avoid combinations of red and green as well as busy background images.

Ref: WCAG 2.2