Guidance (original) (raw)
The UNHCR Data Visualization Guidelines are practical and easy to follow, ensuring your charts and graphics are professional, clear and brand–compliant. Below you will find the elements of a successful chart, the UNHCR colour palette and colour ramps, and the full guidelines downloadable as a PDF.
Data Visualization Guidelines
Data-driven products help us communicate the relevance and impact of UNHCR’s work to the public. All charts and data visualizations created for UNHCR should follow the Data Visualization Guidelines that you can download below.
Colours
UNHCR’s data visualization colour palette is an extension of the official UNHCR brand colours. These colours are carefully selected to ensure accessibility, clarity, and consistency across all visualizations, including infographics, maps, and charts. The data colours should be used for all data visualization, accordance with these guidelines. The Brand colours will continue to be used for all other purposes include reports, websites, banners, etc. For all other visual elements, please use the primary colour palette from the UNHCR's Brand Hub.
The blue colour is the primary colour and should be the predominant colour in all UNHCR visuals. Try to limit the number of different colours in a single graphic. When needed, more colours may be used to ensure clarity, e.g. distinguishing between different categories within the data.
Consistent use of these colours contribute to a coherent and consistent look for UNHCR products across all communication channels and platforms. A strong visual identity improves audience recognition and distinguishes UNHCR from other organisations. Therefore, we strongly recommend implementing these guidelines to the extent possible for all visualizations.
Data colours
Blue (primary)
CMYK: 99, 50, 0, 0
RGB: 0, 114, 188
HEX: #0072BC
Yellow
CMYK: 0, 22, 85, 0
RGB: 255, 199, 64
HEX: #FFC740
Green
CMYK: 70, 0, 63, 0
RGB: 50, 193, 137
HEX: #32C189
Cyan
CMYK: 48, 0, 0, 0
RGB: 108, 216, 253
HEX: #6CD8FD
Red
CMYK: 13, 78, 77, 2
RGB: 210, 90, 69
HEX: #D25A45
Purple
CMYK: 38, 40, 0, 0
RGB: 160, 151, 227
HEX: #A097E3
Brown
CMYK: 35, 79, 72, 35
RGB: 124, 60, 54
HEX: #7C3C36
Grey (neutral)
CMYK: 0, 0, 0, 25
RGB: 191, 191, 191
HEX: #BFBFBF
Colour ramps
Blue | CMYK | RGB | HEX |
---|---|---|---|
Blue 06 | 99, 77, 42, 36 | 11, 55, 84 | #0B3754 |
Blue 05 | 97, 70, 21, 5 | 5, 86, 139 | #05568B |
Blue 04 (Primary) | 99, 50, 0, 0 | 0, 114, 188 | #0072BC |
Blue 03 | 66, 25, 0, 0 | 79, 158, 208 | #4F9ED0 |
Blue 02 | 42, 12, 0, 0 | 143, 193, 225 | #8FC1E1 |
Blue 01 | 18, 4, 0, 0 | 205, 227, 241 | #CDE3F1 |
Yellow | CMYK | RGB | HEX |
---|---|---|---|
Yellow 06 | 46, 58, 100, 39 | 104, 77, 11 | #684D0B |
Yellow 05 | 37, 53, 100, 20 | 143, 104, 8 | #8F6808 |
Yellow 04 | 26, 47, 100, 6 | 185, 132, 5 | #B98405 |
Yellow 03 | 10, 38, 100, 0 | 228, 162, 2 | #E4A202 |
Yellow 02 (Primary) | 0, 22, 85, 0 | 255, 199, 64 | #FFC740 |
Yellow 01 | 0, 4, 20, 0 | 254, 241, 209 | #FEF1D1 |
Green | CMYK | RGB | HEX |
---|---|---|---|
Green 06 | 84, 41, 77, 37 | 31, 87, 65 | #1F5741 |
Green 05 | 84, 30, 76, 16 | 37, 121, 88 | #257958 |
Green 04 | 79, 15, 71, 2 | 43, 156, 112 | #2B9C70 |
Green 03 (Primary) | 70, 0, 63, 0 | 50, 193, 137 | #32C189 |
Green 02 | 47, 0, 38, 0 | 125, 224, 185 | #7DE0B9 |
Green 01 | 13, 0, 9, 0 | 218, 246, 235 | #DAF6EB |
Cyan | CMYK | RGB | HEX |
---|---|---|---|
Cyan 06 | 94, 60, 42, 23 | 11, 82, 105 | #0B5269 |
Cyan 05 | 89, 47, 27, 4 | 8, 114, 149 | #087295 |
Cyan 04 | 80, 28, 10, 0 | 4, 147, 194 | #0493C2 |
Cyan 03 | 68, 9, 0, 0 | 1, 182, 242 | #01B6F2 |
Cyan 02 (Primary) | 48, 0, 0, 0 | 108, 216, 253 | #6CD8FD |
Cyan 01 | 15, 0, 0, 0 | 212, 243, 254 | #D4F3FE |
Red | CMYK | RGB | HEX |
---|---|---|---|
Red 06 | 38, 78, 77, 46 | 104, 50, 41 | #683229 |
Red 05 | 27, 80, 80, 20 | 156, 70, 55 | #9C4637 |
Red 04 (Primary) | 13, 78, 77, 2 | 210, 90, 69 | #D25A45 |
Red 03 | 0, 63, 56, 0 | 246, 127, 106 | #F67F6A |
Red 02 | 0, 36, 27, 0 | 249, 179, 167 | #F9B3A7 |
Red 01 | 0, 13, 8, 0 | 252, 226, 222 | #FCE2DE |
Purple | CMYK | RGB | HEX |
---|---|---|---|
Purple 06 | 80, 79, 38, 28 | 64, 60, 93 | #403C5D |
Purple 05 | 73, 73, 18, 3 | 94, 87, 142 | #5E578E |
Purple 04 | 55, 58, 0, 0 | 126, 116, 194 | #7E74C2 |
Purple 03 (Primary) | 38, 40, 0, 0 | 160, 151, 227 | #A097E3 |
Purple 02 | 22, 23, 0, 0 | 195, 190, 237 | #C3BEED |
Purple 01 | 7, 8, 0, 0 | 231, 229, 247 | #E7E5F7 |
Brown | CMYK | RGB | HEX |
---|---|---|---|
Brown 06 | 48, 75, 70, 62 | 72, 39, 36 | #482724 |
Brown 05 (Primary) | 35, 79, 72, 35 | 124, 60, 54 | #7C3C36 |
Brown 04 | 28, 71, 63, 13 | 166, 91, 84 | #A65B54 |
Brown 03 | 26, 52, 43, 2 | 188, 133, 128 | #BC8580 |
Brown 02 | 17, 32, 26, 0 | 211, 175, 171 | #D3AFAB |
Brown 01 | 7, 14, 10, 0 | 234, 217, 216 | #EAD9D8 |
Grey | CMYK | RGB | HEX |
---|---|---|---|
Grey 06 | 0, 0, 0, 85 | 38, 38, 38 | #262626 |
Grey 05 | 0, 0, 0, 70 | 77, 77, 77 | #4D4D4D |
Grey 04 | 0, 0, 0, 55 | 115, 115, 115 | #737373 |
Grey 03 | 0, 0, 0, 40 | 153, 153, 153 | #999999 |
Grey 02 (Primary) | 0, 0, 0, 25 | 191, 191, 191 | #BFBFBF |
Grey 01 | 0, 0, 0, 10 | 229, 229, 229 | #E5E5E5 |
For more information on colours, such as categorical, sequential, diverging and UNHCR specific colour scales, please refer to the PDF guidelines.
Typography
Fonts
UNHCR has three approved fonts: Proxima Nova, Arial, and Lato. For data visualizations, we recommend using Lato due to the high legibility of numbers, clean design, and wide availability across platforms. Its open letterforms and well-proportioned numerals make it especially suited for charts, maps, and tables where clarity is essential.
Colours
To ensure clarity and consistency, we have created AAA-compliant text coulours for all categorical colours. If using different coloured text is needed for your visual, these colours provide optimal contrast, improving legibility in data visualizations. Although in most cases we will use black text, these text colours are an option that ensures a clear, professional, and cohesive look across UNHCR products.
Blue-AAA
RGB: 5, 86, 139
HEX: #05568B
Yellow-AAA
RGB: 104, 77, 11
HEX: #684D0B
Green-AAA
RGB: 31, 87, 65
HEX: #1F5741
Cyan-AAA
RGB: 11, 82, 105
HEX: #0B5269
Red
RGB: 104, 50, 41
HEX: #683229
Purple-AAA
RGB: 64, 60, 93
HEX: #403C5D
Brown-AAA
RGB: 124, 60, 54
HEX: #7C3C36
Grey-AAA
RGB: 77, 77, 77
HEX: #4D4D4D
Chart elements
We recommend that all chart elements are placed and aligned as shown in the guidelines document. In the document, you can also find specifications – including fonts, font sizes and colours – for each element.