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)