Contrast - Digital Style Guide (2024)

Digital designers are encouraged to make UT colors prominent on their webpages.

Reminder: those colors are orange, Smokey gray, and white.

Foreground text must have sufficient contrast with background colors. This includes text on images, background gradients, buttons, and other elements. Per system policy, all UT websites aim to meet WCAG 2.0 AA guidelines. This includes a required contrast ratio for text and images of text of at least 4.5:1. This applies to live (HTML) text and image text (such as text in banners, images, or graphics).

Text and background color combinations from the UT color palettes that meet this contrast ratio are presented on this page. If you still have questions, refer to WebAim’s color contrast checker.

The contrast ratio between text and its background should be at least 4.5:1. If your font is at least 24 pixels or 19 pixels bold, the minimum is 3:1. When designing, be sure to use a color checker to make sure you are within the tolerance.

LARGE TEXT

Normal Text

Color and contrast tips

  1. Begin your design with high-contrast typography in mind. Don’t start with an airy hard-to-read typestyle that you fall in love with, only to find out at the end you have to change it to meet the guidelines.
  2. Do not “eyeball” the legibility of the text. Be sure to check it with the WebAIM tool–even for text on a background image.
  3. Our primary colors (Orange, White, and Smokey) should be used in every communication. The secondary colors should not overwhelm the design.
  4. Designers are encouraged to use sufficient contrast between text and its background to increase readability, particularly for low-vision users.
  5. Do not underline words that are not links.
Contrast - Digital Style Guide (1)
Contrast - Digital Style Guide (2)
Contrast - Digital Style Guide (3)
Contrast - Digital Style Guide (4)
Contrast - Digital Style Guide (5)
Contrast - Digital Style Guide (6)

Return to Top

Contrast - Digital Style Guide (2024)
Top Articles
Latest Posts
Article information

Author: Gov. Deandrea McKenzie

Last Updated:

Views: 6315

Rating: 4.6 / 5 (46 voted)

Reviews: 93% of readers found this page helpful

Author information

Name: Gov. Deandrea McKenzie

Birthday: 2001-01-17

Address: Suite 769 2454 Marsha Coves, Debbieton, MS 95002

Phone: +813077629322

Job: Real-Estate Executive

Hobby: Archery, Metal detecting, Kitesurfing, Genealogy, Kitesurfing, Calligraphy, Roller skating

Introduction: My name is Gov. Deandrea McKenzie, I am a spotless, clean, glamorous, sparkling, adventurous, nice, brainy person who loves writing and wants to share my knowledge and understanding with you.