layout

Section

Semantic <section> wrapper with max-width presets and vertical padding control. Centers content within a max-width container.

Import

import { Section } from '@stella-ds/react'

Props

PropTypeDefaultDescription
size'sm' | 'md' | 'lg' | 'full''lg'Max-width preset
padding'sm' | 'md' | 'lg' | 'none''md'Vertical padding
asChildbooleanfalseRadix Slot pattern

Examples

Basic

<Section size="lg" padding="lg">
  <Heading level={2}>Features</Heading>
  <Text>Explore what Stella UI offers.</Text>
</Section>
Radio
All Components
Select