Sometimes decorative elements such as logos and illustrations might not meet contrast ratio guidelines. If they serve an important function but are still distinguishable, you don't need to adjust your logo to meet contrast ratios.

University of Illinois at Urbana-Champaign

Contrast ratios are used to represent how different one color is from another, commonly written as 1:1 or 21:1. According to the World Wide Web Consortium (W3C), the contrast ratio between a color and its background ranges from 1-21 based on its luminance or intensity of light emitted. The greater the difference in the two numbers, the greater difference in relative luminance between both colors.

Contrast Ratios

Material Design Documentation

The W3C recommends the following contrast ratio guidelines for body and image text.

Learn Before

Related