colours

Colours controlled by the Global Swatch feature.

Primary

Secondary

Dark Beige

Text Colour

default headings

Default heading styles

heading
one

Heading
two

Heading
three

Heading
four

Heading
five

heading styles

Headings, body and other common text elements.

Display
text

Display
Italic

Heading
Style 1

Heading
Style 2

Heading
Style 3

Heading
Style 4

Heading
Style 5

Heading
Style 6

“We know how much productivity is important for students. For this reason we provide 30% educational discount.:

Small text

uppercase text

Standard Link

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

inverted CTA's

Inverted Button and links variations

outline button

Emphasis

emphasis small

Hover link with arrow

Hover link no arrow

Standard Link

CTA's

Buttons and links

Graphics

Component. Brand mark

Badges

badge

badge outline

Icons

Various icons. Icon fill is inherited from the first parent element Text Colour.

Forms

General style and state variations for form inputs.

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

sections

Various Section sizes

Section / No Padding

Section / Size S

48px

Section

96px

Section / Size L

144px

Section / Size XL

192px

Section colours

BG White

BG Primary

BG Beige

Accordions

Accordion Styles

Getting here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Getting here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Getting here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

heading one

Heading two

Heading three

Heading four

Heading five

Heading five

heading
one

Heading
two

Heading
three

Heading
four

Heading
five

Heading
five