Spacing

Spacing tokens come from packages/theme/src/foundation/spacing.css.

--spacing-px

1px

--spacing-0

0

--spacing-0-5

0.125rem

--spacing-1

0.25rem

--spacing-1-5

0.375rem

--spacing-2

0.5rem

--spacing-2-5

0.625rem

--spacing-3

0.75rem

--spacing-3-5

0.875rem

--spacing-4

1rem

--spacing-5

1.25rem

--spacing-6

1.5rem

--spacing-8

2rem

--spacing-10

2.5rem

--spacing-12

3rem

--spacing-16

4rem

--spacing-20

5rem

--spacing-24

6rem

--spacing-32

8rem

Sizing

Sizing tokens cover icons, controls, and avatars.

--size-icon-xs

0.75rem

--size-icon-sm

1rem

--size-icon-md

1.25rem

--size-icon-lg

1.5rem

--size-icon-xl

2rem

--size-control-xs

1.75rem

--size-control-sm

2rem

--size-control-md

2.5rem

--size-control-lg

3rem

--size-control-xl

3.5rem

--size-avatar-sm

2rem

--size-avatar-md

2.75rem

--size-avatar-lg

4rem

--size-avatar-xl

6rem