Space tokens consumed by Box, FlexBox, and layout primitives.
--space-* custom properties in @prepared911/ui/tokens.css. The step is the pixel size in the name. --space-16 is 1rem (16px at the default root).
| Name | Type | Default | Description |
|---|---|---|---|
--space-4 | dimension | 0.25rem | Tight inset for icons and inline meta. |
--space-8 | dimension | 0.5rem | Default gap between an icon and a label. |
--space-16 | dimension | 1rem | Comfortable padding. Box padding={16} uses this step. |
--space-24 | dimension | 1.5rem | Separation inside a section. |
--space-32 | dimension | 2rem | Large gutters. --space-48, --space-64, --space-80, --space-96, and --space-128 continue the scale. |
FlexBox gap instead of margins between siblings.padding, margin, and gap. Logical sides use blockStart, inlineEnd, blockEnd, and inlineStart.