Color
Our color palette has been established not only to support our brand, but to communicate with our users by reinforcing the purpose of the content.
Primary Brand Colors
PMS 180
#be3a34
rgb 190, 58, 52
cmyk 3, 92, 84, 12
PMS 426
#25282a
rgb 37, 40, 42
cmyk 81, 67, 55, 83
PMS 430
#7c878e
rgb 124, 135, 142
cmyk 13, 5, 0, 44
PMS white
#ffffff
rgb 255, 255, 255
cmyk 0, 0, 0, 0
Secondary Brand Colors
PMS 5435
#a6bcc6
rgb 166, 188, 198
cmyk 28, 7, 4, 12
PMS 550
#8cb8c6
rgb 140, 184, 198
cmyk 43, 5, 6, 10
PMS 5405
#44697d
rgb 68, 105, 125
cmyk 71, 30, 13, 41
(web only)
#304c5d
rgb 30, 55, 69
cmyk 15, 5, 0, 73
PMS 2955
#003865
rgb 0, 60, 105
cmyk 100, 55, 10, 48
PMS 348
#008542
rgb 0, 133, 66
cmyk 100, 4, 87, 18
PMS 484
#9a3324
rgb 154, 51, 36
cmyk 0, 67, 77, 40
PMS 142
#efbd47
rgb 239, 189, 71
cmyk 0, 25, 76, 0
(web only)
#efa63e
rgb 239, 166, 62
cmyk 0, 29, 69, 6
PMS 145
#ca7700
rgb 202, 119, 0
cmyk 0, 49, 100, 8
Grays
(percentages of Primary Black)
5% PMS 426
#f7f7f7
rgb 247, 247, 247
cmyk 0, 0, 0, 3
10% PMS 426
#eaeaea
rgb 234, 234, 234
cmyk 0, 0, 0, 8
20% PMS 426
#d3d4d4
rgb 211, 212, 212
cmyk 0, 0, 0, 17
40% PMS 426
#a8a9aa
rgb 168, 169, 170
cmyk 1, 0, 0, 33
60% PMS 426
#7c7e7f
rgb 124, 126, 127
cmyk 1, 0, 0, 50
80% PMS 426
#515355
rgb 37, 40, 42
cmyk 2, 1, 0, 84
Color Usage
Functionality
We value an aesthetically pleasing use of color, but place a higher value on clear communication. Color supports our visual hierarchy of information, graphic user interface (UI) states, and calls-to-action. Color also has a strong psychological influence, which is considered in our choice of hue and shade.
Use Primary Red sparingly—this color is reserved for the logo and for high-priority information such as navigation and calls-to-action. Otherwise, Dark Red is preferred.
Accessibility
The most important rule in choosing color is maintaining adequate contrast for readability and visual interest. The color system is designed to meet WCAG compliant contrast ratios of at least 3:1 for graphics and user interface components (such as form input borders), 7:1 for normal text, and 4.5:1 for large text. This makes things easier to find, identify, and interact with—though we don’t rely on color alone and always clearly label important information.
For this reason, reversed color logos (white with red stripes) must be used on a background of at least 88% black.
