Color Contrast

Many people have difficult discerning text (foreground) from the background of a page if the contrast is insufficient. It is important that text has sufficient contrast in comparison to the background of a webpage. Insufficient contrast may make the text difficult to read.

The WCAG guidelines that we adhere to require a contrast of 4.5:1. There are several tools for testing color contrast including Webaim Color Contrast Checker and Colour Contrast Analyser. The myUSF default colors have been tested and the contrast is sufficient. If you go beyond the default colors use a tool to test the contrast.

Providing Sufficient Contrast May Benefit

  • People with low contrast sensitivity, which is common in older people.
  • People with color blindness who cannot distinguish between certain colors.
  • High contrast will make content easier for everyone to read, including those who do not have specific visual conditions.

Guidelines for Color Contrast

  • The default colors for text and links on myUSF have sufficient contrast. If you are using the defaults there is no need to check contrast.
  • Ensure that any images or buttons with text have sufficient contrast. The requirement is a minimum of 4.5:1.

Resources