Style Guide | Gielen & Gielen

Section /60-100 padding - Antic normal black

Container /w95%- Maxw 1450px - Relative - Antic normal black

Typography /Antic - Antic Didone - Antic Slab

Fonts

Antic

Antic Slab

Antic Didone

Everything

Antic

Antic Slab

Antic Didone

Everything

Headings - H1 to H6

Header Pagina + Wrapper

Heading Jumbo

Jumbo H1 / 120px / 130px

Heading 1

H1 / 80px / 86px

Heading 2

H2 / 60px / 66px

Heading 3

H3 / 50px / 56px

Heading 4

H4 / 30px / 36px
Just Photoshop out the dog, add a baby, and make the curtains blue i love it
H5 / 20px / 1.3 EM
Just Photoshop out the dog, add a baby, and make the curtains blue i love it
H6 / 16px / 1.3 EM

Paragraphs

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Small Paragraph/ 18px / 24px

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Paragraph/ 20px / 26px

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Big Paragraph/ 24px / 30px

Labels

This is some text inside of a div block.
Small Label/ 12px / 1.4 EM
This is some text inside of a div block.
Normal Label/ 14px / 1.6 EM
This is some text inside of a div block.
Normal Label/ 16px / 1.8 EM

Logos

Logo Full black
Logo Full White
Logo Full BLack
Logo Ninja color

Colors

There's nothing better than using global colors. Changing pink to pinker takes only 2 seconds now.

Black / #000000
Close to black / #222222
50 Shade of Grey / #626262
40 Shade of Grey / #c4c4c4
30 Shade of Grey / #D9D9D9
20 Shade of Grey / #EEEEEE
20 Shade of Grey / #EEEEEE
Burlywood / #e8c6a0

Iconography

Keeping icons consistent has never been easier. With a glance see if you really need to design a new icon.

Licencing
Style Guide
Components
Support
Free Webflow Resources