Visual identity

Color

A consistent, easily-identifiable color palette is a key ingredient for every major brand around the world.

Our Illini Orange and Illini Blue colors have been carefully chosen with accessibility (both for print and web) and differentiation in mind. While most non-designers in the world will simply see orange and blue, lots of testing, tweaking and strategic thought led to this specific palette.

Primary Colors

The strategy for the new visual identity involves leaning more heavily into orange — the color that most differentiates us from competing universities.

Together, the combination of Illini Orange and Illini Blue should make up 75-85 percent visual prominence, in terms of color use on a given piece.

Illini Orange

PMS 1655

CMYK 0/80/100/0

RGB 255/95/5

HEX #FF5F05

  • Altgeld #C84113

Illini Blue

PMS 2767

CMYK 100/90/10/50

RGB 19/41/75

HEX #13294B

Secondary Colors

The supporting palette of colors was chosen to work well with the primary Illini Orange and Illini Blue, without competing with them.

Supporting colors offer design flexibility and usability (especially on web applications), while maintaining an overall look that reads orange and blue. Using any colors other than the those chosen for the brand palette detracts from the brand consistency we need to establish.

Alma Mater

PMS 661C

CMYK 100/85/15/7

RGB 30/56/119

HEX #1E3877

  • #4D69A0
  • #849BC1
  • #AFC7DB

Industrial Blue

PMS 285C

CMYK 90/48/0/0

RGB 29/88/167

HEX #1D58A7

  • #5783BC
  • #90AED5
  • #CAD9EF

Arches Blue

PMS 298C

CMYK 70/5/2/0

RGB 0/159/212

HEX #009FD4

  • #7FC3E1
  • #A6D7EB
  • #D2EBF5

Cloud

PMS COOL GRAY 1C

CMYK 3/2/2/1

RGB 248/250/252

HEX #F8FAFC

  • #E8E9EB
  • #DDDEDE
  • #D2D2D2

Heritage Orange

PMS 715C

CMYK 0/57/94/00

RGB 245/130/30

HEX #F5821E

  • #E56E15
  • #CE5E11
  • #B74D04

Color accessibility on the web

Accessible content is not just “nice to have,” it is a baseline requirement for everything we create. We adhere to WCAG AA standards for all of our online communications.

To make choosing accessible colors easy, we have created this chart showing the accessible and non-accessible combinations of our primary and secondary color palette as applied to large text (24px and larger, 19px bold and larger), small text (23.9px and smaller, 18.9px bold and smaller) and graphic elements.

Accessible Color Combinations
FF5F05 13294B C84113 F5821E 009FD4 1D58A7 1E3877 F8FAFC FFFFFF
FF5F05 Fail Pass Fail Fail Fail Fail Large/bold text only Fail Large/bold text only
13294B Pass Fail Fail Pass Pass Fail Fail Pass Pass
C84113 Fail Fail Fail Fail Fail Fail Fail Pass Pass
F5821E Fail Pass Fail Fail Fail Fail Large/bold text only Fail Fail
009FD4 Fail Pass Fail Fail Fail Fail Large/bold text only Fail Large/bold text only
1D58A7 Fail Fail Fail Fail Fail Fail Fail Pass Pass
1E3877 Large/bold text only Fail Fail Large/bold text only Large/bold text only Fail Fail Pass Pass
F8FAFC Fail Pass Pass Fail Fail Pass Pass Fail Fail
FFFFFF Large/bold text only Pass Pass Fail Large/bold text only Pass Pass Fail Fail
Pass
Color pairing can be used any time
Large/bold text only
Color pairing can only be used on large text and graphic elements
Fail
Color pairing is not accessible