Colour Definitions

The colour palette of the brand comprises of many CSS elements used within the website, however to simplify the branding of documents there is a subsection of colours that should be used when preparing content.

The list below details the colours available along with their codes.

Primary: Brand colour, Main Headers
#2a4982 R42, G73, B130 C0.68, M0.44, Y0.00, K0.49
Grey #1: body text
#222222 R34, G34, B34 C0.00, M0.00, Y0.00, K0.87
Grey #2: signatures
#666666 R102, G102, B102 C0.00, M0.00, Y0.00, K0.60
Grey #3: Secondary headers
#999999 R153, G153, B153 C0.00, M0.00, Y0.00, K0.40
Grey #4: dark grey logo
#aaaaaa R170, G170, B170 C0.00, M0.00, Y0.00, K0.33
Grey #5: light grey logo
#eeeeee R238, G238, B238 C0.00, M0.00, Y0.00, K0.07
Success text:
#468847 R70, G136, B71 C0.49, M0.00, Y0.48, K0.47
Success background:
#dff0d8 R223, G240, B216 C0.07, M0.00, Y0.10, K0.06
Information text:
#3a87ad R58, G135, B173 C0.66, M0.22, Y0.00, K0.32
Information background:
#d9edf7 R217, G237, B247 C0.12, M0.04. Y0.00, K0.03
Warning text:
#c09853 R192, G152, B83 C0.00, M0.21, Y0.57, K0.25
Warning background:
#fcf8e3 R252, G248, B227 C0.00, M0.02, Y0.10, K0.01
Danger text:
#b94a48 R185, G74, B72 C0.00, M0.60, Y0.61, K0.27
Danger background:
#f2dede R242, G222, B222 C0.00, M0.08, Y0.08, K0.05

Using an inverted colour is useful for table headings, e.g. white text on a primary brand background.

Forename Surname Staff Position
Stephen Howarth Public Relations Director
Splendor Bouman Software Department Assistant Director

Using coloured text on the corresponding background colour makes a dramatic message box and is used as static and dismissible alerts on web pages.

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.


Back to Public Relations