Brand

Tone Of Voice

Our copy tone is very important. It reinforces our vision and helps audiences to understand the kind of people we are. In essence, our voice is warm, deep and has a calm authority while preserving a youthful, familiar and natural quality.

  • in the local languages of the markets we operate in
  • in British English on an international level
  • only using a language’s characters and exclude those from other languages
    (e.g. no accents in British English)
  • with a smooth, precise, approachable and friendly voice
  • inspirationally and subtly enthusiastically
  • informally, using ‘we’ instead of ‘Symbiosy’ and ‘we’re’ rather than ‘we are’
  • avoiding colloquialisms and over familiar language
  • credibly and authentically about our services and products
  • stories to communicate our ideas and achievements
  • in conversational language over official, not only to deliver the message, but to bring a human aspect into it, as if it’s from person to person
  • with our core principles and philosophy clearly in mind

Colours

Colours and gradients are the main cornerstones of our identity. Our colour model is derived from representations of heatmaps with 6 dominant colours and linear transitions between them.

Every colour has 3 shades derived from a main colour, one shade with lighter and two shades
with darker variants.

Primary

Anthracite

#0C2431

Grey

#686C6D

White

#FFFFFF

Red

#DB2B3A

Yellow

#FFCB05

Orange

#F37021

Green

#A6CE39

LightBlue

#0DB0CD

DarkBlue

#0F67A9

Secondary

Red-Light-1

#E7747D

Red-Dark-1

#B41F2B

Red-Dark-2

#891721

Orange-Light-1

#F68F51

Orange-Dark-1

#D6580C

Orange-Dark-2

#A54409

Yellow-Light-1

#FFE06B

Yellow-Dark-1

#E2B300

Yellow-Dark-2

#C09800

Green-Light-1

#C5DF7D

Green-Dark-1

#88AA2A

Green-Dark-2

#678120

LightBlue-Light-1

#4CDAF4

LightBlue-Dark-1

#0A879D

LightBlue-Dark-2

#075E6D

DarkBlue-Light-1

#158DE7

DarkBlue-Dark-1

#0B4A7A

DarkBlue-Dark-2

#072E4B

Grey-Light-6

#F8F8F8

Grey-Light-5

#F1F1F1

Grey-Light-4

#E3E4E4

Grey-Light-3

#D6D7D7

Grey-Light-2

#BEC0C0

Grey-Light-1

#979B9B

Grey-Dark-1

#414344

Gradients

Gradients are defined by 2 to 3 colours from our colour palette. Gradients do not need to be uniformly distributed and can contain 2 of the same colours with one additional colour inserted between them. Since our colour model is inspired by heatmaps, our gradients should adapt to the natural transition between colours from the traditional colour spectrum. For example, if you want to create a gradient from red to green, then you have to insert yellow and orange between them.

2 colour gradients

Equally distributed

Red-Orange

Orange-Yellow

Yellow-Green

Green-LightBlue

LightBlue-DarkBlue

Orange-Red

Yellow-Orange

Green-Yellow

LightBlue-Green

DarkBlue-LightBlue

Unequally distributed

Red-Orange

Orange-Yellow

Yellow-Green

Green-LightBlue

LightBlue-DarkBlue

Orange-Red

Yellow-Orange

Green-Yellow

LightBlue-Green

DarkBlue-LightBlue

Orange-Red

Yellow-Orange

Green-Yellow

LightBlue-Green

DarkBlue-LightBlue

Red-Orange

Orange-Yellow

Yellow-Green

Green-LightBlue

LightBlue-DarkBlue

3 colour gradients

Equally distributed

Red-Orange-Yellow

Orange-Yellow-Green

Yellow-Green-LightBlue

Green-LightBlue-DarkBlue

Yellow-Orange-Red

Green-Yellow-Orange

LightBlue-Green-Yellow

DarkBlue-LightBlue-Green

Unequally distributed

Red-Orange-Yellow

Orange-Yellow-Green

Yellow-Green-LightBlue

Green-LightBlue-DarkBlue

Yellow-Orange-Red

Green-Yellow-Orange

LightBlue-Green-Yellow

DarkBlue-LightBlue-Green

Red-Orange-Yellow

Orange-Yellow-Green

Yellow-Green-LightBlue

Green-LightBlue-DarkBlue

Yellow-Orange-Red

Green-Yellow-Orange

LightBlue-Green-Yellow

DarkBlue-LightBlue-Green

Same colours gradients

Red-Orange-Red

Orange-Yellow-Orange

Yellow-Green-Yellow

Green-LightBlue-Green

LightBlue-DarkBlue-LightBlue

Orange-Red-Orange

Yellow-Orange-Yellow

Green-Yellow-Green

LightBlue-Green-LightBlue

DarkBlue-LightBlue-DarkBlue

2 shades gradients

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

3-4 shades gradients

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

Reds

Oranges

Yellows

Greens

Light Blues

Dark Blues

Typography

The visual identity of Symbiosy combines two font families. Our primary typeface is Setup Grotesk, a monolinear sans-serif typeface designed for use in visual identities, packaging and editorial design, while remaining highly efficient in smaller sizes and longer bodies of text. Setup Grotesk is complemented by the bespoke Symbiosy typeface, originally intended for numeral labels, chapters and the decorative emphasis of numbers whenever needed.

Typefaces

Space Grotesk


AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890!@£#$%^&*()

Hierarchy

Heading 1

Setup Grotesk Regular, 52pt / 60pt

Heading 1 Bold

Setup Grotesk Bold, 52pt / 60pt

Heading 2

Setup Grotesk Regular, 36pt / 44pt

Heading 2 Bold

Setup Grotesk Bold, 36pt / 44pt

Heading 3

Setup Grotesk Regular, 28pt / 36pt

Heading 3 Bold

Setup Grotesk Bold, 28pt / 36pt

Heading 4

Setup Grotesk Regular, 22pt / 28pt

Heading 4 Bold

Setup Grotesk Bold, 22pt / 28pt

Heading 5

Setup Grotesk Bold, 19pt / 24pt

Heading 6

Setup Grotesk Bold, 16pt / 20pt

Body Large

Setup Grotesk Regural, 20pt / 32pt

Body Large Bold

Setup Grotesk Bold, 20pt / 32pt

Body Medium

Setup Grotesk Regular, 18pt / 28pt

Body Medium Bold

Setup Grotesk Bold, 18pt / 28pt

Body Small

Setup Grotesk Regural, 16pt / 24pt

Body Small Bold

Setup Grotesk Bold, 16pt / 24pt

Body XSmall

Setup Grotesk Regular, 13pt / 20pt

Body XSmall Bold

Setup Grotesk Bold, 13pt / 20pt

Blockquote

Setup Grotesk Bold, 30pt / 40pt

Font colours

Aa
Aa
Aa
Aa
Aa
Aa

Icons

Our UI icons are designated for websites, apps and other user interfaces. These icons are not intended for marketing purposes.

Line icons

UI icons