Skip to main content

Colour

Our use of colour helps people identify who we are and what we do.

We use a restricted primary colour palette of blue, white, greys and warm yellow that associates us closely with the NHS but also carves a distinct and recognisable identity within a crowded system. 

Primary colours

About 87% of people spontaneously associate blue and white with the NHS. Our use of colour around these elements helps distinguish NHS Digital.

White

White provides an essential design element and can be valued as both a colour and as a spatial element. It is key to the overall identity and designs for NHS Digital should have lots of white space.

Hex: #FFFFFF
RGB: R255, G255, B255
CMYK: 0%C, 0%M, 0%Y, 0%K
Pantone: N/A

NHS blue

NHS blue is used as our primary corporate colour. It reflects the master NHS brand and represents trust and security. NHS blue should be the dominant active colour in all materials.

Hex: #005EB8
RGB: R0, G94, B184
CMYK: 99%C, 50%M, 0%Y, 0%K
Pantone: PMS 300

NHS dark grey

NHS dark grey can be used as a supporting colour, providing a soft contrast to the main NHS blue colour. Grey tints can be used for user interfaces and webpage backgrounds.

Hex: #425563
RGB: R66, G85, B99
CMYK: 58%C, 32%M, 18%Y, 54%K
Pantone: PMS 7545

NHS mid grey

NHS mid grey can be used as a supporting colour, providing a soft contrast to the main NHS blue colour. Grey tints can be used for user interfaces and webpage backgrounds.

Hex: #768692
RGB: R118, G134, B146
CMYK: 35%C, 14%M, 11%Y, 34%K
Pantone: PMS 7544

NHS warm yellow

NHS warm yellow is used sparingly as our accent colour and reflects our innovation and vibrancy. 

Hex: #FFB81C
RGB: R255, G184, B28
CMYK: 0%C, 31%M, 98%Y, 0%K
Pantone: PMS 1235

Secondary colours

NHS Digital has a range of lighter primary colours that can be used to support design elements. 

Blue 1

Hex: #337EC6
RGB: R51, G126, B198

Blue 2

Hex: #ACCAE8
RGB: R172, G202, B232

Blue 3

Hex: #D4E4F3
RGB: R230, G239, B248

Blue 4

Hex: #E6EFF8
RGB: R230, G239, B248

Grey 1

Hex: #687784
RGB: R104, G119, B130

Grey 2

Hex: #98A4AD
RGB: R152, G164, B173

Grey 3

Hex: #B3BBC1
RGB: R179, G187, B193

Grey 4

Hex: #DFE2E5
RGB: R223, G226, B229

Grey 5

Hex: #EDEFF1
RGB: R237, G239, B241

Grey 6

Hex: #F3F5F6
RGB: R243, G245, B246

Grey 7

Hex: #F9FAFB
RGB: R249, G250, B251

Yellow 1

Hex: #FFE8B4
RGB: R255, G232, B180

Yellow 2

Hex: #FFF1CC
RGB: R255, G241, B204

Yellow 3

Hex: #FFF8E8
RGB: R255, G248, B232

Colour hierarchy

Illustration of the the proportion of primary and secondary colours that should be used.

Online text and background colours

Primary text: NHS dark grey

Hex: #212B32
RGB: R33, G43, B50

Primary link: NHS blue

Hex: #005EB8
RGB: R0, G94, B184

Page background: Grey

Hex: #F0F4F5
RGB: R240, G244, B245

Text contrast

Text should always have the clearest contrast with the background for the best legibility and clarity. Colour contrast should always meet the WCAG AA colour contrast.

Do not use black on NHS blue

Incorrect use: Black text on NHS blue

Text should always be clear and legible. Therefore, black text on a NHS blue background is not permitted.
 

Do not use yellow on NHS blue

Incorrect use: Yellow text on NHS blue background for body copy

NHS warm yellow should not be used for text on NHS blue background for body copy as there is not a clear enough contrast to be read by everyone.

Do not use grey on NHS blue

Incorrect use: Grey text on NHS blue background

Grey text should not be used on a NHS blue background as this also does not give a clear enough contrast to be read by everyone.

Do not use yellow on white / grey

Incorrect use: Yellow text on a light background

Yellow text should be avoided for body copy as there is insufficient contrast to be read by everyone.

Tables, charts and maps palette

Tables, charts and maps have their own blue and grey palette which has been designed to be accessible. They have been designed so that the tonal values for the colours have sufficient contrast difference if printed in black and white. 

Table colour palette

Chart colour palette

Maps colour palette

Directorate palette

This palette has been developed to help us describe the organisational structure of NHS Digital and the functions our directorates perform. It is used in our organisational diagram, for example.

 

We only use the directorate colours within the context of NHS Digital primary colour palette. In practice, this means that any collateral using the directorate palette will prominently feature NHS Digital’s main brand colours and only use the directorate colours for the specific purpose of explaining how our organisation works.

 

Please discuss use of the directorate palette with the communications team before using the palette. Email: brandteam@nhs.net

 

Blue: Product development

Hex: #0072CE
RGB: R0, G114, B206
Pantone: 285

Orange: Platforms and Infrastructure

Hex: #ED8B00
RGB: R237, G139, B0
Pantone: 144

Green: Strategy, Policy and Governance

Hex: #006747
RGB: R0, G103, B71
Pantone: 342

Burgundy: Live Services and Cyber Security

Hex: #8A1538
RGB: R138, G21
B56, Pantone: 1955

Grey: Corporate Services

Hex: #425563
RGB: R66, G85, B99
Pantone: 7545

Yellow: Assurance and Risk Management

Hex: #FAE100
RGB: R250, G225, B0
Pantone: Process Yellow

Purple: Data, Insights and Statistics

Hex: #330072
RGB: R51, G0, B114
Pantone: 2685

Last edited: 1 May 2020 7:22 am