Spacing

Defines the relationship between elements and makes the content more easily scannable.


Token
Value
Preview
--sl-space-0
0rem
--sl-space-1
0.25rem
--sl-space-2
0.5rem
--sl-space-3
0.75rem
--sl-space-4
1rem
--sl-space-5
1.25rem
--sl-space-6
1.5rem
--sl-space-7
1.75rem
--sl-space-8
2rem
--sl-space-10
2.5rem
--sl-space-12
3rem
--sl-space-16
4rem
--sl-space-20
5rem
--sl-space-24
6rem
--sl-space-28
7rem
--sl-space-32
8rem
--sl-space-05
0.125rem
--sl-space-gap
var(--sl-space-4)

Want to know more about design tokens? Read the documentation.