UO Color Contrast

This page provides quick reference tables for determining whether different combinations of UO brand colors meet color contrast requirements for accessibility.

"Color contrast" refers to the contrast difference between the color used for text, UI controls, or essential graphical elements against the color background they are on. For general information about color contrast accessibility, visit the Color Guidelines page.

The tables on this page are also available as an Excel spreadsheet, which can be downloaded here.

Technical Standards

Allowed Use

  • Yes: Allowed for all text, UI controls, and essential graphical elements (e.g., icons, focus indicators).
  • Large Only: Only allowed for large text (at least 18pt or at least 14pt bold), UI controls, and essential graphical elements (e.g., icons, focus indicators).
  • No: Not allowed for any text, UI controls, or graphical elements, unless inactive, purely decorative, or part of a logo.

In addition to text, "Yes" cells are presented using bold text and a green background, "Large Only" cells use italic text and a yellow background, and "No" cells use a red background and the text isn't bold or italic.

Color Black (#000000) White (#FFFFFF) UO Green (#007030) UO Yellow (#FEE11A) Legacy Green (#104735) Dark Blue (#004F6E) Grass Green (#489D46) Light Blue (#00A5B5) Lime Green (#8ABB40) Dark Gray (#4D5859) Chartreuse (#E2E11B) Medium Gray (#A2AAAD) Berry (#8D1D58) Light Gray (#D8DcDA)
Black (#000000) No Yes Large Only Yes No No Yes Yes Yes No Yes Yes No Yes
White (#FFFFFF) Yes No Yes No Yes Yes Large Only No No Yes No No Yes No
UO Green (#007030) Large Only Yes No Yes No No No No No No Large Only No No Yes
UO Yellow (#FEE11A) Yes No Yes No Yes Yes No No No Yes No No Yes No
Legacy Green (#104735) No Yes No Yes No No Large Only Large Only Yes No Yes Yes No Yes
Dark Blue (#004F6E) No Yes No Yes No No No Large Only Large Only No Yes Large Only No Yes
Grass Green (#489D46) Yes Large Only No No Large Only No No No No No No No No No
Light Blue (#00A5B5) Yes No No No Large Only Large Only No No No No No No No No
Lime Green (#8ABB40) Yes No No No Yes Large Only No No No Large Only No No Large Only No
Dark Gray (#4D5859) No Yes No Yes No No No No Large Only No Yes Large Only No Yes
Chartreuse (#E2E11B) Yes No Large Only No Yes Yes No No No Yes No No Yes No
Medium Gray (#A2AAAD) Yes No No No Yes Large Only No No No Large Only No No Large Only No
Berry (#8D1D58) No Yes No Yes No No No No Large Only No Yes Large Only No Yes
Light Gray (#D8DcDA) Yes No Yes No Yes Yes No No No Yes No No Yes No

Contrast Ratios (x:1)

All contrast ratios in this table are against 1. For example, a value of "4.8" in the table is a contrast ratio 4.8:1.

The minimum contrast ratio for text is 4.5:1 and the minimum contrast ratio for large text (at least 18pt or at least 14pt bold), UI controls, and essential graphical elements (e.g., icons, focus indicators) is 3:1.

In addition to text, cells with a value of at least 4.5 ("Yes" cells in the Allowed Use table) are presented using bold text and a green background, cells with a value of 3 to 4.5 ("Large Only" cells in the Allowed Use table) use italic text and a yellow background, and cells with a value below 3 ("No" cells in the Allowed Use table) use a red background and the text isn't bold or italic. These styles are identical to the "Allowed Use" table.

Color Black (#000000) White (#FFFFFF) UO Green (#007030) UO Yellow (#FEE11A) Legacy Green (#104735) Dark Blue (#004F6E) Grass Green (#489D46) Light Blue (#00A5B5) Lime Green (#8ABB40) Dark Gray (#4D5859) Chartreuse (#E2E11B) Medium Gray (#A2AAAD) Berry (#8D1D58) Light Gray (#D8DcDA)
Black (#000000) 1 21 3.4 16 2 2.3 6.2 7 9.3 2.9 15 8.9 2.4 15.2
White (#FFFFFF) 21 1 6.2 1.3 10.6 9.1 3.4 2.98 2.3 7.4 1.4 2.4 8.6 1.4
UO Green (#007030) 3.4 6.2 1 4.8 1.7 1.4 1.8 2.1 2.8 1.2 4.47 2.6 1.4 4.5
UO Yellow (#FEE11A) 16 1.3 4.8 1 8.1 6.8 2.6 2.3 1.7 5.6 1.1 1.8 6.5 1.1
Legacy Green (#104735) 2 10.6 1.7 8.1 1 1.2 3.1 3.6 4.7 1.4 7.6 4.5 1.2 7.7
Dark Blue (#004F6E) 2.3 9.1 1.4 6.8 1.2 1 2.6 3.1 4 1.2 6.4 3.8 1 6.5
Grass Green (#489D46) 6.2 3.4 1.8 2.6 3.1 2.6 1 1.1 1.5 2.2 2.4 1.4 2.5 2.5
Light Blue (#00A5B5) 7 2.98 2.1 2.3 3.6 3.1 1.1 1 1.3 2.5 2.1 1.3 2.9 2.2
Lime Green (#8ABB40) 9.3 2.3 2.8 1.7 4.7 4 1.5 1.3 1 3.2 1.6 1 3.8 1.6
Dark Gray (#4D5859) 2.9 7.4 1.2 5.6 1.4 1.2 2.2 2.5 3.2 1 5.3 3.1 1.2 5.3
Chartreuse (#E2E11B) 15 1.4 4.47 1.1 7.6 6.4 2.4 2.1 1.6 5.3 1 1.7 6.1 1
Medium Gray (#A2AAAD) 8.9 2.4 2.6 1.8 4.5 3.8 1.4 1.3 1 3.1 1.7 1 3.6 1.7
Berry (#8D1D58) 2.4 8.6 1.4 6.5 1.2 1 2.5 2.9 3.8 1.2 6.1 3.6 1 6.2
Light Gray (#D8DcDA) 15.2 1.4 4.5 1.1 7.7 6.5 2.5 2.2 1.6 5.3 1 1.7 6.2 1

Contrast Preview

This table shows how different color combinations actually look, and as a result, many of the cells do not have sufficient contrast. The text in this table is identical to the text in the "Allowed Use" table - this table is for visual demonstration only.

Color Black (#000000) White (#FFFFFF) UO Green (#007030) UO Yellow (#FEE11A) Legacy Green (#104735) Dark Blue (#004F6E) Grass Green (#489D46) Light Blue (#00A5B5) Lime Green (#8ABB40) Dark Gray (#4D5859) Chartreuse (#E2E11B) Medium Gray (#A2AAAD) Berry (#8D1D58) Light Gray (#D8DcDA)
Black (#000000) No Yes Large Only Yes No No Yes Yes Yes No Yes Yes No Yes
White (#FFFFFF) Yes No Yes No Yes Yes Large Only No No Yes No No Yes No
UO Green (#007030) Large Only Yes No Yes No No No No No No Large Only No No Yes
UO Yellow (#FEE11A) Yes No Yes No Yes Yes No No No Yes No No Yes No
Legacy Green (#104735) No Yes No Yes No No Large Only Large Only Yes No Yes Yes No Yes
Dark Blue (#004F6E) No Yes No Yes No No No Large Only Large Only No Yes Large Only No Yes
Grass Green (#489D46) Yes Large Only No No Large Only No No No No No No No No No
Light Blue (#00A5B5) Yes No No No Large Only Large Only No No No No No No No No
Lime Green (#8ABB40) Yes No No No Yes Large Only No No No Large Only No No Large Only No
Dark Gray (#4D5859) No Yes No Yes No No No No Large Only No Yes Large Only No Yes
Chartreuse (#E2E11B) Yes No Large Only No Yes Yes No No No Yes No No Yes No
Medium Gray (#A2AAAD) Yes No No No Yes Large Only No No No Large Only No No Large Only No
Berry (#8D1D58) No Yes No Yes No No No No Large Only No Yes Large Only No Yes
Light Gray (#D8DcDA) Yes No Yes No Yes Yes No No No Yes No No Yes No