Skip to content

Card

Card — the standard white surface container: subtle border, soft navy-tinted shadow, 10px radius. Optional top accent stripe ties a card to a brand color.

<Card accent="sky" interactive>
<h3>Patterson Dental</h3>
<p>Everyday essentials and software to run the practice.</p>
</Card>

elevation none→lg, accent navy/sky/green/teal/purple, interactive lifts on hover. Corners are always soft (radius-lg), never sharp.


Source: Card.jsx · Card.d.ts · category: core · live: kitchen sink