Spacing

Spacing

Spacing Values

Margins

Desktop

48

Tablet

32

Phone

20

Max Width

1280

Vertical Padding

200

100 on top and bottom

160

80 on top and bottom

120

60 on top and bottom

Spacing Scale

4px

(16 x 0.25)

8px

(16 x 0.5)

12px

(16 x 0.75)

16px

(16 x 1)

24px

(16 x 1.5)

32px

(16 x 2)

48px

(16 x 3)

64px

(16 x 4)

96px

(16 x 6)

128px

(16 x 8)

192px

(16 x 12)

256px

(16 x 16)

384px

(16 x 24)

512px

(16 x 32)

640px

(16 x 48)

768px

(16 x 64)

Build your next site with Blocs

Never start from scratch again. Launch your site from start to finish in 10 minutes, not 10 days.

A tablet breakpoint of a hero section with centred heading, text and buttons with a full width image
A component control panel of a tooltip component with various settings, such as the variant, text control, a shortcut toggle, a shortcut text input, and a dropdown for the direction of the caret

Build your next site with Blocs

Never start from scratch again. Launch your site from start to finish in 10 minutes, not 10 days.

A tablet breakpoint of a hero section with centred heading, text and buttons with a full width image
A component control panel of a tooltip component with various settings, such as the variant, text control, a shortcut toggle, a shortcut text input, and a dropdown for the direction of the caret

Build your next site with Blocs

Never start from scratch again. Launch your site from start to finish in 10 minutes, not 10 days.

A tablet breakpoint of a hero section with centred heading, text and buttons with a full width image