Skip to main content
Use these guidelines to apply W&M brand colors on websites, email, and other digital media, including accessible color combinations. For print color values and the full brand palette, see the Color Palette page on W&M's Brand Hub.
To test how these colors work in combination with each other from a brand and accessibility perspective, please use our W&M Color Contrast Checker.
Our primary color palette offers strong brand recognition for Â鶹Æƽâ°æ. Green works well as text on light backgrounds and as a background color. Gold is used primarily for interactive elements such as links and buttons and should be used more sparingly.
Hex: #004E38 RGB: 0/78/56
Hex: #B08F5A RGB: 176/143/90
Hex: #D8DCDB RGB: 216/220/219
Hex: #FFFFFF RGB: 255/255/255
Our secondary color palette should be used to enhance layouts, provide tonal range and support visual balance. Some colors are used for specific audiences to embody energy and excitement. For example, our spirit palette is often used in athletic and undergraduate contexts to represent the university with bright, bold color.
Hex: #183028 RGB: 24/48/40
Hex: #FDB714 RGB: 132/104/56
Our neutral palette provides subtle, versatile colors that establish visual hierarchy and breathing room. Use Dark Silver and Soft Black primarily for text.
Hex: #F0F1F2 RGB: 240/241/242
Hex: #565858 RGB: 86/88/88
Hex: #212220 RGB: 33/34/32
Light backgrounds offer clarity, hierarchy, and versatility by breaking up content into definable sections. These colors harmonize with other page elements while maximizing accessibility and readability.
Hex: #E5EDEB RBG: 229/237/235
Hex: #F8F4EE RBG: 248/244/238
Hex: #F1F0F2 RGB: 240/241/242
Hex: #FFFFFF RGB: 255/255/255
Like light backgrounds, dark backgrounds offer versatility while highlighting page content. These backgrounds tend to stand out on the page more and should be used sparingly. In addition, dark gold is commonly used for button elements, links and primary CTAs.
Hex: #183028 RGB: 24/48/40
Hex: #004E38 RGB: 0/78/56
Hex: #848838 RGB: 132/104/56
These colors are used for strokes, dividers, and other borders.
Hex: #99B8AF RGB: 153/184/175
Hex: #004E38 RGB: 0/78/56
Hex: #D8DCDB RGB: 216/220/219
Hex: #565858 RGB: 86/88/88
Copy this into a stylesheet. Values are pulled directly from Â鶹Æƽâ°æ's design system.
:root {
/* Primary */
--wm-green-600: #004E38; /* W&M Green: headings, navigation, button fills. Not body copy. */
--wm-gold-600: #B79257; /* W&M Gold: decorative only, dividers/rules/shapes. Not text on a light background. */
--wm-gold-775: #846838; /* Dark Gold: the accessible gold, for body links and anywhere gold text is read or clicked. */
--wm-white: #FFFFFF;
/* Neutral */
--wm-green-850: #183028; /* Dark Green: dark backgrounds, headings on dark backgrounds. */
--wm-soft-black: #212220; /* Body copy on light backgrounds. */
--wm-silver-600: #D8DCDB; /* W&M Silver */
--wm-green-100: #E5EDEB;
--wm-silver-250: #F0F1F2;
--wm-silver-900: #565858;
--wm-black: #000000;
--wm-softer-black: #323332;
--wm-softest-black: #424343;
}