Colour

Brand colours

Header artwork is a table top birds eye view of three white jars. One of the jars is open and contains dark blue paint. The lid is laying beside the jar. There is a wooden dowel stick on the table that has been dipped inside the jar of paint. There is blue colour on the stick and a small puddle of paint on a rectangular piece of graph paper. The table top remains clean.

Colour is a key factor in the Volvo Cars design system. Used correctly, it creates a consistent brand expression and distinct identity, and helps define our refined, understated aesthetic.

Brand colour palette

Link copied

Our colour palette consists of timeless, versatile blue and grey colours, as well as accent colours. Blues and greys are used in most contexts. Accent colours should be used sparingly. Exceptions apply and will be directed by the central creative strategy for specific activities or campaigns.

Blue colours

#202A44

#1B365D

#7089AC

#CED9E5

Grey colours

#53565A

#888B8D

#A7A8A9

#C8C9C7

#E1DFDD

Black/White

#000000

#141414

#FFFFFF

Orange colours

#A85F02

#BF834B

#D9B48B

#F0DFC6

Red colours

#622128

#9E2A2B

#DDA69D

#F0DDD7

Green colours

#22372B

#476D3B

#A3B2A4

#E0E7D9

Balance and contrast

Link copied

Contrast in colours should be applied in a balanced way. Lighter and darker colours together will make certain parts more visible and improve legibility. Use colours from the same group to maintain balance and contrast.

Mobile with an Instagram post layout. The image is of the XC90 in a studio and has a blue tonality. Side by side there are 3 examples of which colours to use together to create balance and contrast. The first example is the darkest blue as a background together with the lightest blue for a contrast and the slightly darker for the balance. Example 2 is using the lightest blue as a background and the darkest as contrast and a lighter for balance. The third example in using the lightest grey together with the darkest for contrast and a lighter grey for balance.Examples of a balanced use of blue and grey colour sets, in combination with a carefully selected image.Instagram post layout in a orange, red and green theme. Side by side there are 3 examples of which colours to use together to create balance and contrast together with an image of the same tonality.Examples of the accent colour sets in combination with carefully selected images.

Colour and type

Link copied

Finding the right balance between type colour and background makes the text easier to read. Use black text on light backgrounds and white text on dark backgrounds.

An example that shows what readable text colours look like. Light blue text on a dark blue background.Dark blue background together with light blue text. This is readable.
An example that shows what readable text colours look like. Dark blue text on a light blue background.Light blue background together with dark blue text. This is readable.
Dark blue background together with blue text is not readable. Avoid low contrasts like this.Dark blue background together with blue text is not readable.
Light blue background together with white text is not readable. Avoid low contrasts like this.Light blue background together with white text is not readable.

Usage

Link copied

Colour is an important factor for the visual brand identity. Used correctly it creates a consistent brand expression, a distinct identity and a characteristic Scandinavian look and feel. Our colours are used in multiple areas.

An example of using colour on a website view with an image layout. 3 images are put together using the pink colour theme creating a balanced look and feel, which showcases an XC40 and woman driving and loading the 'frunk'.When choosing imagery it is important to create a balanced colour theme.
An example of using colour on our Instagram channel. A dark blue image of the C40 together with white text creates contrast.Text should always be legible.
A mobile view of a charging illustration. A circle in pink and grey colours shows the charging level. Beneath the illustration there is descriptive text.Colour can be applied in infographics and illustrations. Use blue or grey colours with one additional accent colour.

Incorrect usage

Link copied

Here are examples of what to avoid.

An example of a charging infographic using blue, dark and light pink, black and white.Do not use too many accent colours in one composition.
This example shows a random purple colour in use. Avoid colours outside of the Volvo Cars brand and UI colour palettes.Do not use colours outside of the Volvo Cars brand and UI colour palettes.
This example shows an image with a dark blue tone together with a grey text colour. Avoid low contrast text like this.Do not use colours that obscure legibility.
This example shows an image with a pink background in combination with green text overlaid. It looks bad and must be avoided.Do not use colours that clash. Always use colours within the same colour set.
This example is an image with a blue colour filter applied / overlaid. Do not use colour to treat photography at Volvo Cars. Respect the original image.Do not create colour effects.
This example shows a background that consists of three colours, pink, green and blue combined as a colourful gradient. On top there are 4 weather icons in a white outline style.Do not create gradients with more than one colour.
Colours
UI colours
Copyright © 2021 Volvo Car Corporation (or its affiliates or licensors)