Styleguide

Typography

Find all the components needed for your website here.
H1

This is a Header.

H2

This is a Header.

H3

This is a Header.

This is a H3 style text

H4

This is a Header.

Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Leadtext

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Testimonial / Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
Link
Find out more

Colors

The different weights of greys and colors used throughout the website.

Buttons

Different buttons used throughout the website

Columns

The 12 column grid system. Easy to align section across different screen sizes. e.g. a desk-3 column spreads across 3 columns on desktop; thus it has a width of 25% as there can be 4 of these columns next to each other
1 Col
2 Col
3 Col
4 Col
5 Col
6 Col
7 Col
8 Col
9 Col
10 Col
11 Col
12 Col

Spacers

Using the 8pt-system.
16 px
24 px
32 px
48 px
64 px
80 px
96 px
128 px

Text Boxes

Maximum width for text boxes to use throughout the website
400 px
500 px
600 px
700 px
800 px

Icons

Add all icons you're going to use here. Link where you got them from to make sure you can find them again if necessary.

Forms

All form elements
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.