Resources

Sync Figma library

We’re pretty optimistic so we picked
a colour palette to match. It’s bright and contemporary, evoking warmth and technological innovation.

System colours

Our system colours are used solely for notifications, warnings, status messages, and errors.

Error Red 100
Used to indicate errors or really important warnings.
Only use as fills for icons or outline highlights for fields.

Error Red 25
Supports the Error Red, we use this as a background colour for error fields.

Alert Yellow 100
Used to indicate errors or really important  warnings. Only use as fills for icons or outline highlights for fields.

Alert Yellow 25
Supports the Alert Yellow, we use this as  a background colour for important warnings.

Functional grey tones

Mainly used for functional applications, the colour palette is extended to cater for tones of grey.

Grey 125
Use this for T&Cs text on digital applications. It
is dark enough to provide high contrast but not so  dark that it stands out prominent when used for  long paragraphs.

Grey 100
We use this for inactive states on digital fields.

Grey 25
Often unnoticed, wash grey is the studious  worker behind the scenes. It’s always present as  a background in digital media, giving the ability for the white and choral red to really stand out and  be noticed.

Secondary colours

The secondary palette provides us with variety and flavour to support the Choral Red. Only ever use this to highlight areas and aspects of UI design or as supporting colours in graphs.

Blue 100
Used primarily as an interactive highlight in the funnel. It could be used for buttons, field highlight  or text links.

Blue 25
We use this to highlight optioned backgrounds on  the website until a selection is made.

Green 100
Green means go! Use this colour when a field or selection has been correctly filled out or completed.

Green 25
Use this to highlight the background of green  frame fields.

Palette overview

The full palette consists of primary, secondary and system colours. They are organised into families to easily understand how to use each of them.

Please note that we have provided a Pantone coated and uncoated number. For CMYK please refer to a Pantone recommended colour breakdown and work oto match colour with your printer.

PMS

HEX

RGB

RED 150

4D130D

77,19,13

RED 125

D33D3B

211,61,59

CHORAL RED 100

FF4B4A

255,75,74

1787C / 032U

RED 75

FF8D8C

255,141,140

RED 50

FFD6D2

255,214,210

RED 25

FFEBEB

255,235,235

HARMONEY BLACK

434343

67,67,67

COOL GRAY 11C / 432U

GREY 125

8E8E8E

142,142,142

GREY 100

B2B2B2

178,178,178

GREY 50

DBDBDB

219,219,219

GREY 25

F5F5F5

245,245,245

WHITE

FFFFFF

255,255,255

BLUE 150

102B58

16,43,88

BLUE 125

1C5BC2

28,91,194

BLUE 100

206EEE

32,110,238

BLUE 75

73A4F5

115,164,245

BLUE 50

CFE0FC

207,224,252

BLUE 25

F6F9FE

246,249,254

GREEN 150

14391E

20,57,30

GREEN 125

37A355

55,163,85

GREEN 100

45D06C

69,208,108

GREEN 75

7EE399

126,227,153

GREEN 75

C8F3D4

200, 243, 212

GREEN 25

EFFBF2

239,251,242

ERROR RED 100

FF0000

255,0,0

ERROR RED 25

FFF5F5

255,245,245

ALERT YELLOW 100

FFC83B

255,200,59

ALERT YELLOW 25

FFF9EB

255,249,235

Harmoney brand colours

Our primary brand colours are choral red, black and white. We use these colours the most to make sure we are consistent and recognisable throughout all brand communications.

Choral Red 100
Choral Red is our main brand colour and should be the hero in whatever you create. Choral Red can be used with any other brand colour to add dimension, depth, and contrast. Use red in instances where we want to stop someone in their tracks. But being
the hero doesn't mean we always have to be loud. Using red as a highlight in an ocean of white is  equally impactful.

Harmoney Black
This is our visual anchor—a stalwart supporter of our hero colour. It’s not the blackest black to make sure that it sits in harmony with the red. We don’t use it as a fill colour but we do use it for a lot of type.

White
While not as loud as the red, white is an equally important brand colour. White adds a clean understated crispness to our communications.
It’s used for text on top of the Choral Red and for large fills and backgrounds.

Palette overview

Harmoney brand colours

Functional grey tones

CONTENTS

Gradients and shadows