Card

shadcn/ui

6 sub-components

Contained surface for grouping related content. Used for detail panels, KPI metrics, and settings sections.

@/components/ui/card

Anatomy

Card title

Card description — supporting text

Card content — main body of the card. Any content can go here.

Minimal card

No description, no footer.

KPI metric pattern

Open

24+3

Blocked

3-1

Done

142+18

Avg. time

2.4d-0.3

Ticket detail pattern

T7A3763

Open

New account setup — missing registration number

PriorityNormal

PartnerBanana Corp

Assignee

ASAlice Smith

Sub-components

Component	Role
Card	Root — sets bg-card, rounded-xl, border, shadow
CardHeader	Top section with padding — contains title + description
CardTitle	Heading text — h3 by default
CardDescription	Subtitle / helper text below the title
CardContent	Main body area with padding
CardFooter	Bottom section — typically holds action buttons

On this page