Colors

primary

Secondary

Extra

Breakpoints

Breakpoint Resolutie Actief Grid Gutter
FHD (desktop large) 1920x1080px 1920px - ∞ 1440px 33px
XXL (desktop regular) 1440x900px 1440px - 1919px 1170px 25px
XL (desktop small) 1280x800px 1280px - 1439px 1170x 25px
LG (tablet landscape) 1024x768px 1024px - 1279px 940px 20px
MD (tablet portrait) 768x1024px 768px - 1023px -30px (links/rechts) 15px
SM (mobile landscape) 568x375px 568px - 767px -15px (links/rechts) 15px
XS (mobile portrait) 375x568px 0px - 567px -15px (links/rechts) 14px

Typography

Font family

Aa

Source Sans Regular

Aa

Source Sans SemiBold

Aa

Source Sans Bold

Heading 1

Font / weight:
Pangram Bold
Font size:
85px/70px/70px/55px/40px/35px
Line height:
90px/75px/75px/60px/45px/37px
Letter spacing
0,2/0,15/0,15/0,1/0,1/0,05

Lorem Ipsum dolor sit

Lorem Ipsum dolor sit

Heading 2

Font / weight:
Pangram Bold
Font size:
65px/55px/55px/44px/35px/30px
Line height:
70px/60px/60px/47px/38px/33px
Letter spacing
0,15/0,1/0,1/0,1/0,05/0,01

Lorem Ipsum dolor sit

Heading 3

Font / weight:
Pangram Bold
Font size:
50px/40px/40px/32px/30px/28px
Line height:
55px/45px/45px/36px/34px/32px
Letter spacing
0,1/0,05/0,05/0,02/0,01/0,01

Lorem Ipsum dolor sit

Heading 4

Font / weight:
Pangram Regular
Font size:
40px/33px/33px/26px/23px/20px
Line height:
45px/36px/36px/29px/26px/24px
Letter spacing
0,1/0,07/0,07/0,05/0,01/0,01

Lorem Ipsum dolor sit

Lead

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Lead 2

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Subtitle 1

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Subtitle 2

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Placeholder

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Body

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. External link. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, Internal link

Body strong

Font / weight:
Pangram Regular
Font size:
18px/16px/16px/14px/14px/14px
Line height:
30px/26px/26px/21px/21px/21px
Letter spacing
0,01/0,01/0,01/0,01/0,01/0,01

Lorem Ipsum dolor sit

Buttons

Normal button (empty & icon)

Button Button Button