← Back to catalog
Card
StableA structural container with header, title, description, action, content, and footer parts that compose independently.
Server examples
CardHeader, CardTitle, CardDescription, CardAction, CardContent, and CardFooter used together, entirely server-rendered.
Field Notes
A calmer way to collect observations, references, and next steps.
Rendered with no client boundary.
Accessibility notes
- A card is a layout primitive, not a landmark. Give the surrounding section its own heading and aria-labelledby.
- CardAction sits in the header grid; keep it a real interactive element, not a decorative icon.