Grid System

The table of grid system sizes

Device Width

≥ 992px

< 992px

< 767px

< 479px

Max Container Width

1200px

100%

100%

100%

Spacing System

Spacing - Desktop

130 px

70 px

130 px

- Paddings Tops and Bottom for blocks - 130 px
- Inside of Blocks (between headlines and inside a content block) - 70px

Spacing - Tablet

80 px

50 px

80 px

- Paddings Tops and Bottom for blocks - 80 px
- Inside of Blocks (between headlines and inside a content block) - 50px

Spacing - Mobile

60 px

30 px

60 px

- Paddings Tops and Bottom for blocks - 60 px
- Inside of Blocks (between headlines and inside a content block) - 30px

Color Palette

Primary

#f74070

#f87c57

#fdf4f7

#888888

#222222

Secondary

#ffffff

#f9f9fa

#e9e9e9

#e9e9e9

#000000

Typography

Headers - Desktop

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Headers - Tablet

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Headers - Mobile

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Body

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.

Paragraph Large

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.

Links

Link With Icon

List

  • List item
  • List item
  • List item
  • List item

Buttons

Primary Button
Primary Button Arrow
Primary Button White
Primary Button Grey
Text Button
webflow icon
Buy this Template
More Templates
Hire a Webflow Professional to build a website using this template. Learn More