Layout
Container
Page-level wrapper that caps content width and applies consistent lateral padding from tokens. Polymorphic via the as prop.
Examples
Constrained content
Loading preview
<Container maxWidth="sm">Centered, width-capped content</Container>API
| Prop | Type | Default | Description |
|---|---|---|---|
maxWidth | 'sm' | 'md' | 'lg' | 'xl' | 'full' | lg | Max content width; full removes the constraint. |
padding | 'none' | 'sm' | 'md' | 'lg' | md | Lateral padding. |
centered | boolean | true | Center horizontally within the parent. |
Guidelines
Do
- Use one Container per page region to keep line lengths readable.
Avoid
- Do not nest Containers; use Stack or Grid inside instead.