StylesColour

Always use the Home Office colour palette when you are designing and building internal services and products. For public facing and transactional sites use the GOV.UK colour palette.

Ask ucdops@homeoffice.gov.uk if you have any questions.

Main colours

Brand colour

#732282

Purple is the Home Office's brand colour. This doesn't mean you should use it as the dominant colour in a digital interface.

Overusing the purple can make content hard to read on screen, particularly on services that are designed to be used for long periods of time.

Home Office purple works best in digital interfaces when it's just used for the Home Office logo and sparingly used as a keyline or accent.

Page background

#f5f5f5

Use light grey as the page background colour on internal services to minimise eye strain caused by high-contrast user interfaces. It's also better for readability for those with dyslexia.

Border

#cbcbcb

Use mid-grey for borders and to help define elements where needed.

Text and links

Use the GOV.UK colours for text and links as these are accessible with the Home Office page background.

Extra colours

You can use the GOV.UK colour palette alongside the main Home Office colours. Use them to create graphs and supporting materials. If you need to use tints of the palette, use either 25% or 50%.

Accessibility

There should be enough difference (contrast) between a background and the foreground content so that user can easily differentiate the two. See the colour and contrast guidance for more information.

If your service uses colour, let us know of any insights you have on accessibility considerations.

Accessible text and background combinations

Below are the colour combinations that pass.

A
Background: #0b0c0c
Foreground: #ffffff
A
Background: #ffffff
Foreground: #0b0c0c
A
Background: #cbcbcb
Foreground: #0b0c0c
A
Background: #00703c
Foreground: #ffffff
A
Background: #1d70b8
Foreground: #ffffff