Section

Full-width page band with optional background, vertical padding, and gap. Compose with Wrapper for centered content.

Example

Section — default background, medium padding
Section — muted background, large padding
Section — default background, small padding

Props

NameTypeDefaultRequiredDescription
gap0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16—NoVertical gap between children
padding'none' | 'sm' | 'md' | 'lg' | 'xl''none'NoBlock (top/bottom) padding
background'default' | 'muted' | 'primary'—NoBackground color

Accessibility

  • Renders semantic <section> element for document outline

Related Tokens

--section-padding