Skip to content

The <Stack> component lays out its children vertically with consistent spacing between them. Optionally, it can show dividers between its children.

Examples

Default

Spacing

Dividers



Examples

Nested <Stack>s with different spacing

Card 1

Image

Some content in a card.

Card 2

Image

Some other content in a card.

Props

<Stack>

children

Required
ReactNode

className

Deprecated
string

dividers

1 | 2 | 3

spacing

0 | 1 | 2 | 3 | 4 | 5 | "0" | "1" | "2" | "3" | "3-half" | "4" | "5"

ref

(instance: any) => void | RefObject<any>