Stack is a layout component that places elements on top of each other.
It's useful for creating overlapping UI elements with a consistent stacking context.
A comparison of stacked and non-stacked elements using the Stack component.
Stack is a standalone component.
The Stack component places elements on top of each other in a stacking context. It's useful for creating overlapping UI elements like cards with badges, images with captions, or any design that requires layering.
| Stack Props | Type | Description |
|---|---|---|
is | string | Allows changing the element tag. Default is |
| Stack Slots | Description |
|---|---|
default | The default slot. Elements placed here will be stacked on top of each other. |
Stacking cards to create an overlapping card UI.
Stacked cards with shadow effects for depth.
Stacked cards with different background colors.
Stacking images to create an overlapping avatar or gallery effect.
