No Preview

Sorry, but you either have no stories or none are selected somehow.

If the problem persists, check the browser console, or the terminal you've run Storybook from.

Spacing

Consistent spacing allows elements to stand out. It improves scannability and reduces noise.

All spacing is defined using the em unit. This ensures spacing is relative to the parent element's font-size.

Name Value Example
$spacing-none 0
$spacing-quarter 0.25rem
$spacing-half 0.5rem
$spacing-tight 0.75rem
$spacing-base 1rem
$spacing-loose 1.5rem
$spacing-double 2rem
$spacing-triple 3rem
$spacing-quadruple 4rem