Beta

This is a new service and pages are being tested and improved.

Core colours

Tints of each colour can also be used. You should use use either 70%, 40% or 10% tints of the colours. Tints are created by adding white rather than using transparency.

Trio of teals

Government Project Delivery uses a trio of teal colours. These should be used for journey line.

A teal box showing the brand colour of #008c8a
C84 M25 Y48 K4 | R0 G140 B138 | #008c8a
C78 M13 Y38 K0 | R0 G165 B166 | #00a5a6
C60 M2 Y24 K0 | R92 G192 B197 | #5cc0c5

Accessible teal

C93 M51 Y53 K31 | R0 G83 B90 | #00535a

Background

Base background colour

#ffffff

Alternate background colour

#cbe7e9

Dark background colour

#1a2233

Informational background colour (or/and for notes)

#f1f0f3

Pale alternate background colour

#e5f3f4

Text

Base text colour

#0b0c0c

Link text colour

#01807e

Alternate text colour (for dark backgrounds)

#ffffff

Secondary text colour (for hint and placeholder text)

#505a5f

Borders

Default border colour

#c3c1c9

Input border colour

#0b0c0c

Alternate border colour

#4dafad

Interaction colours

Buttons

Default button background colour

#01807E

Alternate button background colour

#cbe7e9

Light button background colour

#ffffff

 

Focus

Default focus colour

#f9a826

Focus text colour

#0b0c0c

Link interactivity

Link hover colour

#016765

Link visited colour

#00535a

Link active colour

#0b0c0c

Status-based colours

Default success colour

#066830

Default error colour

#c42d15

Interactivity error colour

#aa2a16

Consultation or feedback colour

#fbcb7d

In development colour

#fde5be

In progress colour

#fef2de

Not started colour

#f1f0f3
Back to top