Components
Card
componentcontainerlayoutcollection
A contained surface grouping related content into a scannable, self-contained unit.
When to use
- Collections of equal-weight items (products, articles, projects)
- Dashboard widgets grouping a metric and its context
- Content that needs visual separation from surrounding UI
Examples
- Pricing tier card (title + price + feature list + CTA)
- Project card (thumbnail + name + last modified)
See this in the wild
Analyze a site and look for card in the breakdown.
