Spacing

Spacing scale used across the platform.

Spacing Scale

Horizontal bars representing each spacing value.

1

0.25rem (4px)

2

0.5rem (8px)

3

0.75rem (12px)

4

1rem (16px)

6

1.5rem (24px)

8

2rem (32px)

10

2.5rem (40px)

12

3rem (48px)

16

4rem (64px)

20

5rem (80px)

24

6rem (96px)

Usage Guidance

When to use which spacing values.

gap-2 / p-2Tight spacing (form fields, badges)
gap-4 / p-4Standard spacing (card padding, list items)
gap-8 / p-8Section spacing
py-16 / py-20Page-level vertical spacing