The website uses a color palette that very closely aligns itself with MCC’s Default and Supporting color palettes identified in its Standards for Global Marking and Branding. The Web palette’s colors are slightly more saturated and meet accessibility guidelines for color.
Web Color Palette
| Example |
Name |
Code |
|
Web Deep Blue |
- RGB:
rgb(0, 37, 99)
- Hex:
#002563
- CSS class to apply background:
.bkgd-color-web-deep-blue
- CSS class to change object color:
.color-web-deep-blue
- SASS variable:
$web-deep-blue
|
|
Web Bold Blue |
- RGB:
rgb(21, 87, 197)
- Hex:
#1557c5
- CSS class to apply background:
.bkgd-color-web-bold-blue
- CSS class to change object color:
.color-web-bold-blue
- SASS variable:
$web-bold-blue
|
|
Web Bright Blue |
- RGB:
rgb(154, 216, 253)
- Hex:
#9ad8fd
- CSS class to apply background:
.bkgd-color-web-bright-blue
- CSS class to change object color:
.color-web-bright-blue
- SASS variable:
$web-bright-blue
|
|
Web Deep Green |
- RGB:
rgb(39, 89, 55)
- Hex:
#275937
- CSS class to apply background:
.bkgd-color-web-deep-green
- CSS class to change object color:
.color-web-deep-green
- SASS variable:
$web-deep-green
|
|
Web Red |
- RGB:
rgb(184, 30, 60)
- Hex:
#b81e3c
- CSS class to apply background:
.bkgd-color-web-red
- CSS class to change object color:
.color-web-red
- SASS variable:
$web-red
|
|
Web Yellow |
- RGB:
rgb(243, 203, 0)
- Hex:
#f3cb00
- CSS class to apply background:
.bkgd-color-web-bright-yellow
- CSS class to change object color:
.color-web-bright-yellow
- SASS variable:
$web-bright-yellow
|
|
Off Black |
- RGB:
rgb(34, 34, 34)
- Hex:
#222222
- CSS class to apply background:
.bkgd-color-off-black
- CSS class to change object color:
.color-off-black
- SASS variable:
$off-black
|
|
Dark Grey |
- RGB:
rgb(120, 120, 120)
- Hex:
#787878
- CSS class to apply background:
.bkgd-color-grey-dark
- CSS class to change object color:
.color-grey-dark
- SASS variable:
$grey-dark
|
|
Medium Grey |
- RGB:
rgb(204, 208, 214)
- Hex:
#ccd0d6
- CSS class to apply background:
.bkgd-color-grey-medium
- CSS class to change object color:
.color-grey-medium
- SASS variable:
$grey-medium
|
|
Pale Grey |
- RGB:
rgb(217, 217, 217)
- Hex:
#d9d9d9
- CSS class to apply background:
.bkgd-color-grey-pale
- CSS class to change object color:
.color-grey-pale
- SASS variable:
$grey-pale
|
