Color and sensory

Sensory characteristics

Perceivable
Level A

Benefits: Blind and low-vision disabilities.

Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, size, visual location, orientation, or sound.

How to pass
  • Can the user access instructions for using the content, even when they cannot perceive shape or size or use information about spatial location or orientation?
  • Are descriptions of controls solely via references to visual or auditory cues avoided?
  • Is additional information provided other than shape and/or location?
  • Does positioning, color, and labeling help identify the information?

Use of color

Perceivable
Level A

Benefits: Colorblind disabilities.

Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.

How to pass
  • Verify that color alone is not used to convey important information.
  • Can all of the information be understood when viewing the page in grayscale?
  • Can all of the page functions be performed when viewing the page in grayscale?

Contrast

Perceivable
Level AA

Benefits: Low-vision and colorblind disabilities.

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

  • Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.
  • Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration,that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
  • Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.
How to pass
  • Is the color contrast of the text and its background readable by low-vision users?
  • Using a color contrast tool - are color contrast ratios at least 4.5:1 for text that is < 18 point/24 px, and for bold text that is < 14 point/18.5 px?
  • Using a color contrast tool - are color contrast ratios at least 3:1 for large-scale text that is at least 18 point/24 px, and for large-scale bold text that is at least 14 point/18.5 px?
  • Is there a text that is only decorative and conveys no information? (Decorative text does not need to meet color contrast guidelines)