Layout Components

Documentation

Layout Components

Primitives to layout, group, and structure components within a design system.

Explore the layout primitives. Build responsive layouts quickly with full control over spacing, distribution, and alignment using Flexbox and Grid.

Box 1
Box 2
Box 3
Flex
Flexbox container for aligning items.
Stack Item 1
Stack Item 2
Stack Item 3
Stack
A vertical stack helper.
Grid 1
Grid 2
Grid 3
Grid 4
Grid 5
Grid 6
Grid
Grid layout configuration.
Max-width Medium Container
This container is constrained to a medium size (max-width: 768px) and centered on the page.
Container
Constrains and centers content.

Found something to improve?

Notice a bug, typo, or missing detail on this page? Help us make the documentation better by opening a GitHub issue.