01. Grid

02. Colors

Background
Text
Accent
Complementary, links
Alt background 1
Alt background 2
Border

03. Typography

Open Sans
AaZz

Regular

AaZz

SemiBold

AaZz

Bold

Playfair Display
AaZz

Regular

AaZz

Bold

Display
Size: 95px — L-Height: 1.1 (105px)

Display

Heading H1
Size: 61px — L-Height: 1.15 (70px)

Heading 1

Heading H2
Size: 49px — L-Height: 1.15 (56px)

Heading 2

Heading H3
Size: 39px — L-Height: 1.15 (45px)

Heading 3

Heading H4
Size: 31px — L-Height: 1.15 (36px)

Heading 4

Heading H5
Size: 25px — L-Height: 1.15 (29px)

Heading 5

Heading H6
Size: 20px — L-Height: 1.15 (23px)

Heading 6

Body / Paragraph
Size: 16px — L-Height: 1.6 (26px)

Whenever I go back to the guest house during the morning to copy out the contract, these gentlemen are still sitting there eating their breakfasts.

Name Description
Joe Macaroni Works in the mafia
Paj Rakovski Dentist as hobby
Andrei Sustafusta Eating breakfasts

Blockquote pariatur commodi enim, nobis voluptate dolorum odit laudantium fugiat cumque voluptate eligendi consequatur!

Balena Johnson

04. Buttons & Media

Primary button Secondary Outline Default