Colours are a key element in our brand. They work to maintain consistency and create clarity.
Primary colours
The primary colours are used for key design elements such as logos, headlines, icons, key visuals and striking areas. They serve to clearly convey the brand and should dominate in all main applications. Large areas of colour, modules and structuring elements should primarily be kept in the primary colours to ensure a consistent and powerful appearance.
WHITE
HEX #ffffff
RGB 255, 255, 255
CMYK 0,0,0,0
BLACK
HEX #000000
RGB 0, 0, 0
CMYK 0,0,0,100
FLUORESCENT ORANGE
HEX #ff5f00
RGB 255, 95, 0
CMYK 0,70,95,0
SOLAR MIST
HEX #9aeedf
RGB 154, 238, 223
CMYK 40,0,20,0
Colour weighting
White is the dominant primary colour and determines the overall impression. It is always in the foreground and forms the visual basis of all applications. Orange and solar are used sparingly as accent colours. They complement the appearance in a targeted manner and must never dominate white. Black serves as a functional colour for typography and graphic elements. It is used sparingly and in a similar proportion to the accent colours to ensure legibility and contrast.
Secondary Colors
The secondary colours complement the primary colour system and expand the creative scope without overshadowing the core identity. They support the company‘s communicative flexibility and enable a differentiated, modern design across various applications.
Secondary colours are used specifically for accentuation, for structuring areas of information and for illustrative or supporting elements.
They are suitable for diagrams, backgrounds, UI elements, highlights and visual balancing areas. They should clearly support the primary colours, not compete with them. They are used sparingly and functionally to ensure a harmonious, technically precise overall picture while offering sufficient variability for different media.
DARK PURPLE
HEX #7b0876
RGB 123, 8, 118
CMYK 0,93,12,52
INDIGO
HEX #2f2381
RGB 47, 35, 129
CMYK 100,98,11,2
BLUE
HEX #0743ed
RGB 7, 67, 237
CMYK 90,70,0,0
GREEN
HEX #37c99f
RGB 55, 201, 159
CMYK 70,0,50,0
UX colour palette
Wave is our digital design system – a tailor-made library of user interface components, behaviours and utilities for designers and developers designing our products and digital services.
Based on our brand colour palette, we have defined a selection of colours specifically for Wave, and are classified as UX colours, as we like to call it. For our products and digital services, this palette of colours are used exclusively. Each colour in Wave has it's defined purpose. Colours should not be mixed about, nor should any new colours be added in the mix.
Read more about Wave and the use of UX colours here.
Universal design
It’s important that communication and services are user-friendly and accessible for as many people as possible, regardless of abilities or disabilities. Therefore, there are some important rules to remember when applying colours and deciding on sizes, to ensure that all our communication and materials are designed consistently.
To ensure good readability, all text must have sufficient contrast to the background. This is important for all users, especially under demanding lighting conditions. When working with small print, it is doubly important to have good colour contrast against backgrounds. Avoid using light shades for text on light backgrounds, or dark shades for text on dark backgrounds.
Colour contrast
Contrast is based on brightness, where maximum contrast is 21:1 for black to white. For contrast measurements it doesn’t matter what the foreground or background colours are, because user experiences vary greatly. A great many users are very light sensitive and may prefer dark background with light text. Contrast requirements depend on the size of the text.
Large text is defined as 18 pt and larger, and 14 pt and larger for bold text style. If you're designing for web and prefer text sizes in pixels, 18 pt equals to approximately 24 px, and 14 pt to approximately 19 px.
WCAG 2.1 sets out the size of the text:
Contrast requirements – AA (minimum) Large text: 3.0:1 Small text: 4.5:1
Contrast requirements – AAA (recommended) Large text: 4.5:1 Small text: 7:1
In order to reproduce colour accurately in different applications, it is important to use our specific colour formulas which have been tested and converted to be consistent across different media.
Be sure to choose the correct colour system according to your paper type and printing method, which is explained as following:
Pantone (PMS):
This colour formula is used only when offset printing with spot (Pantone) colours. It is the most accurate method of reproducing colours. For example: stationery.
CMYK:
This colour formula is used for 4-colour process printing and digital printing. It is the most commonly used formula for Volue printed materials, since it is best for printing applications that contain full colour images. For example: brochures, posters and product sheets.
RGB / Hex:
This colour formula is used for digital, on-screen applications only. For example: our website, web banners, animations and powerpoint presentations.
