Beta

This is a new service and pages are being tested and improved. Give feedback to help improve it.

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