Axonyx UI

Layout primitive

Container

Container establishes a predictable page boundary with semantic max widths, responsive gutters, fluid mode, and optional layout recipes.

Next: Grid

Width boundaries

sm

Focused reading and form content.

lg

Documentation and product content.

xl

Dashboards, catalogs, and application shells.

Responsive padding

Choose `none`, `sm`, or `lg` when the surrounding shell owns a different gutter rhythm.

Code
ax
<Container max="lg" padding="sm">
  <PageContent />
</Container>

Fluid composition

Fluid mode removes the maximum width while preserving the component contract.

Code
ax
<Container fluid="true" recipe="app-shell">
  <Dashboard />
</Container>