Colours

How to use colours to create consistent and user friendly online experiences on Barking and Dagenham digital products.

Brand colours

Red

Hex code: #E60000

Accent colour for icons and non-text decoration


Example of the 'Red' colour used in our Design System

 

Black 

Hex code: #0B0C0C

Body copy, headings, borders, footer background


Example of the 'Black' colour used in our Design System

 

White

Hex code: #FFFFFF

Copy on dark backgrounds, background, footer text


Example of the 'White' colour used in our Design System

 

Dark aubergine

Hex code: 320A4B


Example of the 'Purple' colour used in our Design System

 

Component colours

Black

Hex code: #0B0C0C

Body text


Example of the 'Black' colour used in our Design System

 

Yellow

Hex code: FFDD00

Focus state for text. Can also be used as an outline for non text elements such as buttons, links around images and alert banners.


Example of the 'Yellow' colour used in our Design System

 

Blue

Hex code: #2832A0

Linked text and information alerts.


Example of the 'Blue' colour used in our Design System

 

Green

Hex code: #007934

Call to action/start buttons. Positive state to inform user about success and progress.


Example of the 'Green' colour used in our Design System