Incorrect Color Contrast

Overview

This page depicts violations of Success Criterion 1.4.3 Contrast (Minimum). 

Back to Accessibility Checklist

Jump to correct usage of color contrast

Insufficient Color Contrast

The image in this example uses color contrast that is well below the minimum. 

 

Gauge with low, medium, and high; needle points to high.

Why Is This a Violation?

The text in the chart graphic is below 4.5:1 contrast ratio which is in violation of success criteria 1.4.3 of the WCAG AA. The image does contain an equivalent alternative text description which serves the needs for the non-sighted, however the low-sighted community will have difficulty perceiving this content as it violates SC 1.4.3.

How Do I Fix It? 

Increase the contrast of the colors from foreground to background to be at least 4.5:1.