Skip to main content
Skip to navigation

Accessible Text Color Combinations

Use of the MU gold #F1B82D and other variations of gold on white background and white text on gold background presents an accessibility concern specified in Web Content Accessibility Guideline (WCAG) 2.0 1.4.3 Contrast Minimum AA.

This quick guide contains alternative color choices you can use to ensure accessibility while following the Mizzou branding standards.

Rules of Thumb

MU gold #F1B82D (or variations of gold) text on a white background - doesn’t pass color contrast for accessibility.

The inverse, white text on a MU gold background - doesn’t pass color contrast for accessibility.

Below are alternative accessible colors commonly used by Marketing and Communications or colored text:

Use Accent Colors

  • Red #900000
  • Orange #BD4D1F

How can you use more Gold in your designs?

You can use gold in rules, borders, backgrounds, behind black text, and as text on black backgrounds.

MU gold variations

  • #FFF4D6
  • #FEE8B6
  • #FBD986
  • #F1B82D (MU gold)
  • #D79900
  • #AF7C00

Note:

#F1B82D is MU gold.

Only #AF7C00 passes the color contrast test on large text (14 point and bold or larger, or 18 point or larger). Also this particular color looks pretty brown or coppery and isn’t very appealing as text. It’s best for borders and shadows on other gold objects. Do not use it for text. It’s best to stick with dark grays or an accent variation that does pass.

Free Color Checkers

Below is a list of free color analyzer tools for testing color contrast. The checkers have different functionality and can be used together to compliment each another. On occasion, designers will have to use their best judgement with regards to size and contrast.

Colour Contrast Analyser 

Runs on Mac or PC and can test text within images, colors in a document, etc.

WebAIM Color Contrast Checker 

Simple hex color online tool.

Deque aXe Developer Tools 

Browser extensions for Chrome or Firefox.

Color Contrast Analyzer for Chrome 

Chrome extension that allows you to analyze text color contrast problems on a webpage according to the WCAG 2 text color contrast requirements. It can analyze a portion of a web page, the entire visible contents of a tab, or an entire web page.