Color Contrast in Webcourses@UCF

Color Contrast Against White Background

The WCAG 2.0 guidelines establish the color contrast between text and the background color in HTML content. For text below 14 point, the ratio is 4.5 to 1. For text larger than 14 point, the ratio is 3 to 1. The three tables below show the default 39 colors available in the rich content editor in Webcourses@UCF. Use them as a guide to determine the appropriate color use in Webcourses@UCF. Utilize the WebAIM Color Contrast Checker to test a different background color.

Fail: Below 4.5 to 1 Ratio

ColorRatioSample
Olive4.2Olive
Red4.1Red
Gray3.95Gray
Sea Green3.57Sea Green
Magenta3.14Magenta
Orange2.94Orange
Medium Gray2.85Medium Gray
Plum2.19Plum 
Amber2.14Amber
Pink1.97Pink
Peach1.97Peach
Turquoise 1.97Turquoise 
Sky Blue1.9Sky Blue
Yellow Green1.9Yellow Green
Light Sky Blue1.69Light Sky Blue
Gold1.51Gold
Light Yellow1.46Light Yellow
Lime1.37Lime
Aqua1.25Aqua
Pale Green1.12Pale Green
Pale Cyan1.09Pale Cyan
Yellow1.07Yellow
White0White

Good: (4.5-7 to 1 Ratio)

ColorRatioSample
Red Violet6.95Red Violet
Grayish blue5.35Grayish Blue
Green5.14Green
Teal4.77Teal
Royal Blue4.68Royal Blue

 

Best: Over 7 to 1 Ratio

ColorRatioSample
Black21.1Black
Navy Blue16.01Navy Blue
Dark Green14.25Dark Green
Dark Olive13.01Dark Olive
Very Dark Gray12.63Very Dark Gray
Dark Azure12.6Dark Azure
Maroon10.95Maroon
Indigo10.12Indigo
Purple 9.42Purple 
Blue 8.59Blue 
Burnt Orange7.43Burnt Orange