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 design@digital.homeoffice.gov.uk if you have any questions.
Main colours
Brand colour
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
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
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.
Foreground: #ffffff
Foreground: #0b0c0c
Foreground: #0b0c0c
Foreground: #ffffff
Foreground: #ffffff