CPS brand colours

Hex: #f2a900
CSS: cps-yellow

Text colour: #000000
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #002d72
CSS: cps-blue

Text colour: #ffffff
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #ba0c2f
CSS: cps-red

Text colour: #ffffff
Text contrast: Pass (AA)
Large text contrast: Pass (AAA)

Hex: #746661
CSS: cps-warm-grey

Text colour: #ffffff
Text contrast: Pass (AA)
Large text contrast: Pass (AAA)

Hex: #ffffff
CSS: coc-white

Text colour: #333333
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Shades of blue based off the CPS blue

Grey colours used for backgrounds or other UI are based off of the CPS blue #002d72.

Hex: #001f4f
CSS: cps-blue-3D

Text colour: #ffffff
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #00245b
CSS: cps-blue-2D

Text colour: #ffffff
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #002866
CSS: cps-blue-1D

Text colour: #ffffff
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #33578e
CSS: cps-blue-1L

Text colour: #ffffff
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)

Hex: #6681aa
CSS: cps-blue-2L

Text colour: #ffffff
Text contrast: Pass (AA)
Large text contrast: Pass (AAA)

Hex: #99abc6
CSS: cps-blue-3L

Text colour: #000000
Text contrast: Pass (AAA)
Large text contrast: Pass (AAA)