Spacing

Utilities to form the spacing system


Spacing scale

By default, Elements CSS includes a generous and comprehensive numeric spacing scale. The values are proportional, so 16 is twice as much spacing as 8 for example. One spacing unit is equal to 0.25rem, which translates to 4px by default in common browsers.

NameSizePixelsPreview
000
px1px1px
0.50.125rem2px
10.25rem4px
1.50.375rem6px
20.5rem8px
2.50.625rem10px
30.75rem12px
3.50.875rem14px
41rem16px
4.51.125rem18px
51.25rem20px
61.5rem24px
71.75rem28px
82rem32px
92.25rem36px
102.5rem40px
112.75rem44px
123rem48px
133.25rem52px
143.5rem56px
153.75rem60px
164rem64px
184.5rem72px
205rem80px
246rem96px
287rem112px
328rem128px
369rem144px
4010rem160px
4812rem192px
5614rem224px
6015rem240px
6416rem256px
7218rem288px
8020rem320px
9624rem384px