# Colours

> Primary and secondary colours with HEX, RGB, CMYK, Pantone and RAL, and what to use them for.

Source: https://brand.viscohoreca.nl/en/colours

Colour is the quickest way people recognise Visco, so always use the same ones.

> Click a value to copy it. Always take values from this list. If you pick them out of a logo with an eyedropper, they will be slightly off.

## Primary colours

These are the colours you will use most.

| Colour | HEX | RGB | CMYK | Pantone C | RAL | Usage |
| --- | --- | --- | --- | --- | --- | --- |
| Visco oranje | #E9540D | 233, 84, 13 | 1, 77, 100, 0 | 166 C | 2004 Zuiver oranje | The main colour. For calls to action, accents and recognition. |
| Diepzwart | #1D1D1B | 29, 29, 27 | 74, 65, 63, 81 | 419 C | 9005 Gitzwart | For text and legibility. Slightly warmer than pure black. |
| Noordzee blauw | #154284 | 21, 66, 132 | 100, 78, 18, 4 | 7687 | 5002 Ultramarijnblauw | Supporting. For balance and calm, and for the wordmark in the logo. |
| Wit | #FFFFFF | 255, 255, 255 | 0, 0, 0, 0 | - | - | Background and white space. Give the logo and the text room to breathe. |

## Secondary colours

The secondary colours add some variety without making things busy. Use them for small accents and for highlights in images.

| Colour | HEX | RGB | CMYK | Pantone C | RAL | Usage |
| --- | --- | --- | --- | --- | --- | --- |
| Warm oranje | #ED6C05 | 237, 108, 5 | 0, 68, 99, 0 | 3564 C | 2008 Licht roodoranje | A subtle accent next to Visco oranje, for instance in a gradient or a second panel. |
| Zacht oranje | #F28B2D | 242, 139, 45 | 0, 54, 87, 0 | 715 C | 1007 Narcissengeel | Highlights within visuals, and where Visco oranje comes out too heavy. |
| Licht oranje | #FEFAF8 | 254, 250, 248 | 0, 2, 3, 0 | - | - | Visco oranje at 3% opacity. For quiet panels and backgrounds behind text. |
| Signaal rood | #E30613 | 227, 6, 19 | 0, 100, 98, 0 | 2035 C | 3024 Briljantrood | Only where extra emphasis is needed. This is also the colour of the dot in the symbol. |

## Use

| Do/don’t | Rule |
| --- | --- |
| ✅ | Orange for calls to action, accents and recognition. |
| ✅ | Black for text and legibility. |
| ✅ | Dark blue for balance and support. |
| ✅ | White as a resting point: give surfaces room. |
| ❌ | Using red as an ordinary accent colour. It is for extra emphasis. |
| ❌ | Mixing colours into intermediate values that are not listed here. |
| ❌ | Picking a colour out of a logo instead of taking it from this page. |