Color is used throughout Folwell to provide recognizable visual patterns for visitors, making University of Minnesota websites easier to use and more predictable.
Official maroon and gold should be used prominently on all University websites. Dark and light versions of maroon and gold may be used to complement the official colors.
Any secondary colors may be used with University branding, except any combinations that appear similar to other primary color combinations for Universities within the Big10. For secondary color options, see the University Relations website.
Usage, Best Practice, and Accessibility
Example
Brand colors
Dark Maroon
#5b0013
#5b0013
Light Maroon
#900021
#900021
Gold
#ffcc33
#ffcc33
Maroon
#7a0019
#7a0019
Dark Gold
#ffb71e
#ffb71e
Light Gold
#ffde7a
#ffde7a
Neutral colors
Darker Gray
#333333
#333333
Medium Gray
#777677
#777677
Lighter Gray
#f0efee
#f0efee
Dark Gray
#5a5a5a
#5a5a5a
Light Gray
#d5d6d2
#d5d6d2
Off White
#f9f7f6
#f9f7f6
Usage
The default color palette for Folwell is enabled out of the box.
Best Practice
- Maroon accent colors should be used very sparingly. Do not use these colors for large backgrounds.
- Make sure there is a high contrast between your text color and your background color.
- Avoid placing text over backgrounds with similar color values; this can make reading more difficult.
- Using a strong primary (or priority) color can pack a lot of meaning, create focus, and highlight features.
- Keep it simple. Color should not distract from the main message.
Accessibility
- Neutral grays for background should be used in combination with text and images that have enough contrast to pass accessibility requirements.
- All color use must be checked for color contrast to ensure accessibility. See the Color & Contrast page on the Accessible U site for more information about color.
Resources