Colors
All Compass colors directly mirror the current VCU Brand digital colors. These colors are defined on the root of each page as VCU-prefixed custom CSS properties.
Palette
Primary colors best represent the university and should be the most dominant colors on the page. This includes gold, black, gray, and white.
Gold
var(--vcu-gold)#ffb300
Black
var(--vcu-black)#000000
Gray
var(--vcu-gray)#dedede
White
var(--vcu-white)#ffffff
Accent colors give a pop of color and help you create your own identity. These should be used sparingly and include rust, plum, blue, and forest.
Rust
var(--vcu-rust)#b02e01
Plum
var(--vcu-plum)#8e6a90
Blue
var(--vcu-blue)#006894
Forest
var(--vcu-forest)#0b652e
Distribution
Colors should be used more or less than others to ensure optimal distribution to stay on-brand. In the following distribution chart, you can see gold and black should be used more than gray, white, or the accent colors, and gray and white should be used more than the accent colors.
Contrast
When used as backgrounds, colors must be paired with an appropriate text color for adequate contrast to meet WCAG AA requirements. This means gold, gray, and white should be paired with dark text, while black, rust, blue, and forest should be paired with light text. Plum can be paired with either dark or light text.