Use a stack to lay children out in a single direction — vertically or horizontally — with consistent spacing and alignment. It’s based on CSS Flexbox.
Figma
The Figma reference for Stack will appear here once the design link is added.
Storybook
Interactive examples for Stack will render here once the Storybook link is wired in.
Best practices
- Use a stack for a simple row or column of elements with even spacing.
- Don’t use it for complex, two-dimensional arrangements — use a grid for that.
- Don’t use it for large-scale page layout.
- Control spacing with tokens and prefer logical alignment properties.