Wrapper

Centered max-width container with horizontal padding. Controls content width and provides edge breathing room on small viewports.

Example

xs — 480px
sm — 560px
md — 768px

Props

NameTypeDefaultRequiredDescription
size'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full''lg'NoMax-width constraint
padding'none' | 'sm' | 'md' | 'lg' | 'xl''lg'NoHorizontal (inline) padding tier

Accessibility

  • Renders a plain <div> — no ARIA roles needed

Related Tokens

--wrapper-padding-x-sm--wrapper-padding-x-md--wrapper-padding-x-lg--wrapper-padding-x-xl--wrapper-xs-max-width--wrapper-sm-max-width--wrapper-md-max-width--wrapper-lg-max-width--wrapper-xl-max-width