Container

v1.0.0

Centers and constrains content within a max-width container.

Try adjusting the container size controls below.

Centered Constrained Layout (Max-Width: 1024px)

A full-width container that spans the entire viewport.

100% Width Edge-to-Edge Fluid Area

Choose between different max-width presets.

size="sm" (Max: 640px)

size="md" (Max: 768px)

size="xl" (Max: 1280px)

Removes horizontal padding for flush edge alignment.

Padding Removed (Flush Edge alignment)

Properties API

All available props for this component.

Property	Type	Default	Description
size	"sm" \| "md" \| "lg" \| "xl" \| "2xl"	"lg"	Defines the max-width bounds configuration of the component layout block.
fluid	boolean	false	Overrides preset sizing bounds to lock container layout to width: 100% infinitely.
clean	boolean	false	Removes default responsive structural side gutters (px fields) from the layout primitive wrapper.
className	string	""	Additional raw Tailwind or custom CSS fallback style hooks to attach onto the parent DOM element node.