Styleguide

Colours

Colour Hex Value Variable
#ef3125 $red
#eeb310 $yellow
#0054a3 $blue
#2f2f2f $charcoal
#eeeeee $light-grey
#f8f8f8 $off-white

Typography

H1

Futura Bold

50px

Main Header

H2

Futura Bold

30px

Heading

H3

Futura Bold Italic

28px

Sub Header

H4

Futura Bold

24px

Content Heading
H5
Futura Bold
18px
Content Heading

p

Futura Book Italic

16px

Body Text


Standard body text - 16px Futura Book
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Strong text.

Iconography

Buttons

Default button
Button Button - Hover

Secondary button
Button Button - Hover

Navigation

Default Hover Pressed Active
Link Link Link Link

Pagination

Previous Post Lorem Ipsum dolor Electronic Register
< Next Post Lorem Ipsum dolor Electronic Register

Lists

  1. Item 1
  2. Item 2
  3. Item 3

Forms

  • 100 words

Cards