Don’t use color alone to inform

• Multimodal Communication: Use more than just color to convey information, indicate actions, or differentiate elements.

• Complementary Methods: Provide additional cues, such as text labels, patterns, or shapes, to ensure that information is accessible to those who may have color vision deficiencies or other visual impairments.

‍

• Good: A form error message is indicated with both a red border and a text label stating “Error” next to the field.

• Good: A chart uses different shapes or patterns in addition to colors to distinguish between data series.

• Bad: A button’s state (e.g., enabled or disabled) is indicated only by changing its color, without any additional text or visual cues.

• Color Perception: This guideline specifically addresses the use of color for conveying information. For color-related accessibility concerns, refer to Guideline 1.3 which includes programmatic access and other visual presentation coding.

‍

• Combine color with text labels, patterns, or shapes to ensure that information is conveyed effectively to all users.

• Use high contrast between text and background colors to enhance readability.

• Test with users who have color vision deficiencies to ensure that your design is accessible.

1. Design Review: Check that color is not the only method used to convey information. Ensure additional cues such as text, shapes, or patterns are present.

2. Color Vision Simulation: Use tools or simulations to view your design with different color vision deficiencies and ensure that information remains accessible.

3. User Feedback: Obtain feedback from users with color vision deficiencies to confirm that they can access and understand the information presented.

‍