Colors for Web

Color use is one of the most effective ways to make an immediate connection to UW–Madison. The official university colors are Badger (also referred to as Cardinal) red and white. Colors used in UW–Madison’s web themes and templates are displayed below.

Color SASS Variable HEX Code Purpose/Usage
UW Red $uw-red #c5050c

UW–Madison’s primary color. Used for design elements, navigation bars, nonlinked headers, and backgrounds. Not used for links.

UW Red Dark $uw-red-dark #9b0000

Accent color. Used in alternating boxes component.

UW Page Background $uw-page-bg #f7f7f7

Background and accent color.

UW Gray-Blue $uw-gray-blue #dadfe1

Background and accent color.

UW Gray Darker $uw-gray-darker #646569

Design element background color and accent color.

UW Gray Darkest $uw-gray-darkest #282728

Design element background color, accent color, and footer background color. Often used in place of black.

UW Body Font $uw-body-font #494949

Used for standard text on a white background.

UW Anchor Color $uw-anchor-color #0479a8

Used for links in standard text on a white background.

UW Gray Footer Text $uw-gray-footer-text #adadad

Used for footer text.

UW Gray Footer Text Hover $uw-gray-footer-text-hover #f9f9f9

Used for links in footer text.

For easy access to the UW web color palette in Adobe applications, open the Swatches palette in your application and click on the top right menu. Select “Open Swatch Library” and then select “Other Library.” Navigate to where the downloaded swatch file is located on your computer.

Download the UW Adobe Color Palette for Web (.ase file in zip archive)