Typography

H1 Heading example

H1 Cormorant Garamond

H2 Heading example

H2 Cormorant Garamond

H3 Heading example

H3 Cormorant Garamond

H4 Heading example

H4 Cormorant Garamond

H5 Heading example

H5 Cormorant Garamond

H6 Heading example

H6 Cormorant Garamond

Sample body Text: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam aliquam lacinia eros, non tristique libero accumsan eu. Pellentesque hendrerit justo.

p Lato

Sample bold body Text: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam aliquam lacinia eros, non tristique libero accumsan eu. Pellentesque hendrerit justo.

p Lato

Colours

$white

#FFFFFF

$black

#000000

$navy

#3f4955

$dark-navy

#3f4955

$midnight-navy

#0f1315

$slight-cream

#f5f1ec

$cream

#e9e0d9

$gold

#c4a577

$dark-gold

#917140

$light-blush

#dabbb3

$blush

#c99d90

$dark-blush

#ba847d

$off-white

#fcfcfc

$light-grey

#f9f9f9

$raspberry

#d61606

$useful-grey

#C4C4C4

Form Elements

Buttons

Dark Button (style 1)

Large Dark Button

class="button button-black"

Medium Dark Button

class="button button-black medium"

Small Dark Button

class="button button-black small"

Gold Button (style 2)

Large Gold Button

class="button button-gold"

Medium Gold Button

class="button button-gold medium"

Small Gold Button

class="button button-gold small"

White Button (style 3)

Large White Button

class="button button-white"

Medium White Button

class="button button-white medium"

Small White Button

class="button button-white small"

Button style 4

Button Style 4

class="button button-style-4"

Button style 5

Button Style 5

class="button button-style-5"

Components

Standard textfield

Standard dropdown

We'll only use your email address to notify you

Standard textfield with message

Please enter a valid email address

Standard textfield in error

Standard textfield in success

Material textfield

Material dropdown

Text area

Radio button

Radio button selected

Checkbox

Checkbox checked