Primitive
Card
A quiet paper surface: precise edges, restrained rounding, and minimal elevation.
States
Default
Wednesday’s delivery
Greenleaf Market, 7–9 pm. Four items, $18.40.
Raised tone
Wednesday’s delivery
Greenleaf Market, 7–9 pm. Four items, $18.40.
Interactive
Highlighted
Wednesday’s delivery
Greenleaf Market, 7–9 pm. Four items, $18.40.
No padding
Padding is yours.
When to use
- Grouping related content that stands on its own.
When not to
- Nesting inside another card. Use a divider or the raised tone instead.
Props
| Name | Type | Notes |
|---|---|---|
| padding / interactive / highlighted / tone | interactive strengthens the border; wrap the content in a real link or button yourself. |
* required
Accessibility invariants
- Purely presentational. Interactivity must come from a child link or button.
Agent instructions
For anything generating UI from this system
Wrap standalone content. Do not nest cards. For a clickable card, put a link inside and set interactive.