Palettes
Our palettes are collections of brand colours that we use together to form the palette for a website. Constraining our design to a few colours helps give a consistent, professional appearance.
- Primary – used for navigation bar, calls to action.
- Secondary – used for secondary navigation bar
- Tertiary – used, usually all together, to add style and differentiate between items in a set (for example, tiles).
Default palette
Primary - Blue
Selected
Transparent
Base hover
Selected hover
Transparent hover
Secondary - Blue light
Selected
Transparent
Base hover
Selected hover
Transparent hover
Tertiary 1 - Green
Selected
Transparent
Base hover
Selected hover
Transparent hover
Tertiary 2 - Burgundy
Selected
Transparent
Base hover
Selected hover
Transparent hover
Tertiary 3 - Purple
Selected
Transparent
Base hover
Selected hover
Transparent hover
Study palette
Primary - Cyan
Selected
Transparent
Base hover
Selected hover
Transparent hover
Secondary - Cyan light
Selected
Transparent
Base hover
Selected hover
Transparent hover
Tertiary 1 - Green
Selected
Transparent
Base hover
Selected hover
Transparent hover
Tertiary 2 - Purple
Selected
Transparent
Base hover
Selected hover
Transparent hover
Bootstrap contexts
Success - Green
Selected
Transparent
Base hover
Selected hover
Transparent hover
Info - Blue light
Selected
Transparent
Base hover
Selected hover
Transparent hover
Warning - Orange
Selected
Transparent
Base hover
Selected hover
Transparent hover
Danger - Red
Selected
Transparent
Base hover
Selected hover
Transparent hover