Colours
| Brand Colours | Spec |
|---|---|
|
|
#000000 rgb (0, 0, 0) --color-brand-primary |
|
|
#2930a3 rgb (237, 60, 40) --color-brand-cobalt-blue |
|
|
#f8c800 rgb (248, 200, 0) --color-brand-saffron-yellow |
|
|
#ff4d82 rgb (255, 77, 130) --color-brand-flamingo-pink |
|
|
#f9400f rgb (249, 64, 15) --color-brand-persimmon-orange |
|
|
#73c3f8 rgb (115, 195, 248) --color-brand-celestial-blue |
|
|
#9762f3 rgb (151, 98, 243) --color-brand-orchid-purple |
|
|
#009d1f rgb (0, 157, 31) --color-brand-jade-green |
|
|
#e2dfd5 rgb (226, 223, 213) --color-brand-beige |
|
|
#f1f1f0 rgb (241, 241, 240) --color-brand-off-white |
| Typography Colours | Spec |
|---|---|
|
|
#000000 rgb (0, 0, 0) --text-color--primary |
|
|
#ADADAD rgb (173, 173, 173) --text-color--secondary |
|
|
#FFFFFF rgb (255, 255, 255) --text-color--inverse |
| Background / Surface / Border Colours | Spec |
|---|---|
|
|
#000000 rgb (0, 0, 0) --background-color--dark |
|
|
#EBEBEB rgb (235, 235, 235) --background-color--brand-light |
|
|
#FFFFFF rgb (255, 255, 255) --background-color--white |
|
|
#ADADAD rgb (239, 239, 239) --border-color--light |
|
|
#000000 rgb (0, 0, 0) --border-color--dark |
|
|
#000000 rgb (0, 0, 0) --border-color--dark |
| Link / Button Colours | Spec |
|---|---|
|
|
#000000 rgb (0, 0, 0) --button--dark |
| Support Colours | Spec |
|---|---|
|
|
#D70000 rgb (215, 0, 0) --color-brand--red |
Typography
| Desktop | Mobile | Spec |
|---|---|---|
Display 1 |
Display 1 |
.d1, .display-1 |
Display 2 |
Display 2 |
.d2, .display-2 |
Display 3 |
Display 3 |
.d3, .display-3 |
| Headings Desktop | Headings Mobile | Spec |
|---|---|---|
Heading 1 |
Heading 1 |
h1, .h1 |
Heading 2 |
Heading 2 |
h2, .h2 |
Heading 3 |
Heading 3 |
h3, .h3 |
Heading 4 |
Heading 4 |
h4, .h4 |
Heading 5 |
Heading 5 |
h5, .h5 |
Heading 6 |
Heading 6 |
h6, .h6 |
| Body Desktop | Body Mobile | Spec |
|---|---|---|
|
Text block |
Text block mobile |
.textblock |
|
Subtitle 1 |
Subtitle 1 mobile |
.subtitle-1 |
|
Subtitle 2 |
Subtitle 2 mobile |
.subtitle-2 |
|
Body 1 |
Body 1 mobile |
.body-1 |
|
Body 2 |
Body 2 mobile |
.body-2 |
| - | ||
| Text Link | Mobile Text Link | - |
Form
| Styles | |||
|---|---|---|---|
|
|
|||
|
|
|||