Components

Card

Keeps related content and actions together on one surface.

28 October 2026

Added

First version: Card with the Card.Header, Card.Title, Card.Description, Card.Actions, Card.Body, Card.Footer and Card.Link parts.
variant (outlined, elevated, filled) and padding (md 16 px, lg 24 px).
A titled card is a <section> named by its title.
interactive: the hit area of the one link covers the card; 2 px lift on hover (motion.lift), focus ring around the card.
The part prop types are exported: CardHeaderProps, CardTitleProps, CardDescriptionProps, CardActionsProps, CardBodyProps, CardFooterProps, CardLinkProps.

Changed

Corner radius is 14 px (card-radius). An outlined card takes a 1 px ring that takes no space instead of a border; on an interactive card the ring darkens on hover.