Colours
Overview
Our colour palettes
We use four main colour palettes across our digital and print materials to establish the Office for National Statistics (ONS) brand.
Primary brand palette
The primary colour palette complements the ONS logo colours.
Night blue
- RGB
- 0, 60, 87
- CMYK
- 100, 39, 0, 63
- Pantone
- 2188 CP
Spring green
- RGB
- 168, 189, 58
- CMYK
- 26, 1, 100, 10
- Pantone
- 583 CP
Aqua teal
- RGB
- 0, 163, 166
- CMYK
- 86, 0, 45, 0
- Pantone
- 7466 CP
Ocean blue
- RGB
- 32, 96, 149
- CMYK
- 93, 51, 6, 4
- Pantone
- 2151 CP
Sky blue
- RGB
- 39, 160, 204
- CMYK
- 86, 8, 0, 0
- Pantone
- 299 CP
Supporting palette
The supporting palette is used to add a greater degree of reality.
Indigo blue
- RGB
- 60, 56, 142
- CMYK
- 92, 87, 0, 0
- Pantone
- 2104 CP
Plum purple
- RGB
- 144, 32, 130
- CMYK
- 53, 99, 0, 0
- Pantone
- 513 CP
Flamingo pink
- RGB
- 223, 6, 103
- CMYK
- 0, 100, 24, 4
- Pantone
- 214 CP
Ruby red
- RGB
- 208, 2, 27
- CMYK
- 10, 100, 94, 3
- Pantone
- 186 CP
Jaffa orange
- RGB
- 250, 100, 1
- CMYK
- 0, 71, 95, 0
- Pantone
- 3564 CP
Sun yellow
- RGB
- 251, 201, 0
- CMYK
- 0, 20, 100, 2
- Pantone
- 7406 CP
Neon yellow
- RGB
- 240, 247, 98
- CMYK
- 9, 0, 66, 0
- Pantone
- 386 CP
Leaf green
- RGB
- 15, 130, 67
- CMYK
- 87, 0, 99, 32
- Pantone
- 2259 CP
Grey palette
The grey palette is used for fonts and shadowing.
Black
- RGB
- 34, 34, 34
- CMYK
- 0, 0, 0, 87
- Pantone
- Black 3 CP
Grey 100
- RGB
- 65, 64, 66
- CMYK
- 40, 30, 20, 66
- Pantone
- Cool Grey 10 CP
Grey 75
- RGB
- 112, 112, 113
- CMYK
- 54, 43, 42, 20
- Pantone
- Cool Grey 9 CP
Grey 35
- RGB
- 188, 188, 189
- CMYK
- 30, 22, 22, 3
- Pantone
- Cool Grey 7 CP
Grey 15
- RGB
- 226, 226, 227
- CMYK
- 14, 10, 10, 0
- Pantone
- Cool Grey 4 CP
Grey 5
- RGB
- 245, 245, 246
- CMYK
- 5, 4, 4, 0
- Pantone
- Cool Grey 1 CP
White
- RGB
- 255, 255, 255
- CMYK
- 0, 0, 0, 0
People palette
The people palette keeps our illustrations of people consistent. It can be used for skin tone and hair colour.
This palette is for people illustrations only and should not be used in other contexts.
People tone 1
- RGB
- 244, 212, 174
- CMYK
- 4, 19, 35, 0
- Pantone
- 475 C
People tone 2
- RGB
- 241, 192, 159
- CMYK
- 5, 30, 39, 0
- Pantone
- 474 C
People tone 3
- RGB
- 204, 142, 74
- CMYK
- 17, 46, 76, 6
- Pantone
- 721 CP
People tone 4
- RGB
- 178, 91, 32
- CMYK
- 23, 68, 95, 14
- Pantone
- 723 CP
People tone 5
- RGB
- 135, 76, 43
- CMYK
- 32, 67, 82, 35
- Pantone
- 2320 CP
People tone 6
- RGB
- 117, 70, 60
- CMYK
- 35, 66, 62, 45
- Pantone
- 7588 CP
People tone 7
- RGB
- 85, 49, 23
- CMYK
- 41, 70, 87, 63
- Pantone
- 2322 CP
Tints
We use either 70%, 40% or 10% tints of our colours. Tints are created by adding white, rather than using transparency.
Example
70% Night blue
- RGB
- 77, 119, 137
- CMYK
- 44, 13, 0, 46
- Pantone
- 2166 C
40% Night blue
- RGB
- 153, 177, 189
- CMYK
- 19, 6, 0, 26
- Pantone
- 536 C
10% Night blue
- RGB
- 230, 236, 238
- CMYK
- 3, 1, 0, 7
- Pantone
- 649 C
Accessible colour contrast
ONS colours must be used with the correct contrast to meet accessibility requirements.
We have tested the contrast between foreground and background colours to make sure they meet level AA of the Web Content Accessibility Guidelines (WCAG 2.1) (opens in a new tab)
Chart colours
We use a separate colour palette for building charts on the ONS website. The colours should be used in the order shown in the palette.
Primary chart colour palette
Include a maximum of five colours in a chart to keep it from becoming too crowded.
The full nine-colour palette can accommodate for limited cases when more colours are needed.
Ocean blue
- RGB
- 32, 96, 149
- CMYK
- 93, 51, 6, 4
- Pantone
- 2151 CP
Sky blue
- RGB
- 39, 160, 204
- CMYK
- 86, 8, 0, 0
- Pantone
- 299 CP
Night blue
- RGB
- 0, 60, 87
- CMYK
- 100, 39, 0, 63
- Pantone
- 2188 CP
Emerald green
- RGB
- 17, 140, 123
- CMYK
- 82, 22, 57, 6
- Pantone
- 328 CP
Spring green
- RGB
- 168, 189, 58
- CMYK
- 26, 1, 100, 10
- Pantone
- 583 CP
Beetroot purple
- RGB
- 135, 26, 91
- CMYK
- 44, 99, 26, 21
- Pantone
- 7650 CP
Coral pink
- RGB
- 246, 96, 104
- CMYK
- 0, 74, 48, 0
- Pantone
- 178 CP
Lavender purple
- RGB
- 116, 108, 177
- CMYK
- 64, 60, 0, 0
- Pantone
- 2100 CP
Mint green
- RGB
- 34, 208, 182
- CMYK
- 66, 0, 40, 0
- Pantone
- 7465 CP
Alternate chart colour palette
The alternate chart colour palette is arranged in a different order for the first five colours.
This provides more options for busier charts, such as line charts with overlapping lines.
Ocean blue
- RGB
- 32, 96, 149
- CMYK
- 93, 51, 6, 4
- Pantone
- 2151 CP
Sky blue
- RGB
- 39, 160, 204
- CMYK
- 86, 8, 0, 0
- Pantone
- 299 CP
Beetroot purple
- RGB
- 135, 26, 91
- CMYK
- 44, 99, 26, 21
- Pantone
- 7650 CP
Spring green
- RGB
- 168, 189, 58
- CMYK
- 26, 1, 100, 10
- Pantone
- 583 CP
Coral pink
- RGB
- 246, 96, 104
- CMYK
- 0, 74, 48, 0
- Pantone
- 178 CP
Highlight colour
The highlight colour is used to call attention to a certain category in a chart.
It falls below 3:1 contrast ratio against white, so should only be used when overlaid on other colours. For example, to highlight a category in a combined line and bar chart.
It should ideally only be used with the primary chart palette, as it is a complementary colour.
Highlight orange
- RGB
- 243, 148, 49
- CMYK
- 0, 50, 85, 0
- Pantone
- 715 CP
Adjustments for text
Three of the chart colours fall below the 3:1 colour contrast ratio to help with colour differentiation.
We use darker colours over the 3:1 threshold that have been adjusted for text labels on charts.
Any text where the colour contrast ratio is below 4.5:1 must be at least 14 point bold or 18 point regular.
Spring Green adjusted for chart text
- RGB
- 138, 155, 46
- CMYK
- 11, 0, 70, 39
Mint green adjusted for chart text
- RGB
- 26, 165, 144
- CMYK
- 84, 0, 13, 35
Highlight orange adjusted for chart text
- RGB
- 245, 105, 39
- CMYK
- 0, 57, 84, 4
Adobe downloads
Our colour profiles and swatches are available to download and use with Adobe.
Colour profiles
The colour profiles pack contains:
- ONS Coated.csf
- ONS Photography (Adobe RGB).csf
- ONS Uncoated.csf
Download the ONS Adobe colour profiles pack (1.4MB) (opens in a new tab)
To edit colour profiles across the Adobe Suite:
- Open Adobe Bridge and go to “Edit” then “Colour settings” select “Show saved colour settings”.
- Drop the .csf files into the finder window and select “ONS Coated” on the menu, this will make the dialog box disappear.
- The default profiles for Adobe programs will now be sRGB for screen, FOGRA39 for print.
Swatches
The swatches pack contains:
- ONS RGB colour swatches for digital
- ONS CMYK colour swatches for print
- ONS Pantone colour swatches for print
Download the ONS Adobe swatches pack (7KB) (opens in a new tab)
Help improve this page
Let us know how we could improve this page, or share your user research findings. Discuss this page on GitHub (opens in a new tab)