Card
Card
Contained surfaces for grouping related content
npx rootnative add card
Docs
Variants
elevated
This is a non-interactive elevated card.
filled
This is a non-interactive filled card.
outlined
This is a non-interactive outlined card.
Interactive Variants
elevated
Tap this interactive elevated card.
filled
Tap this interactive filled card.
outlined
Tap this interactive outlined card.
Disabled Variants
elevated
Disabled elevated card.
filled
Disabled filled card.
outlined
Disabled outlined card.
Regions
Media + Content
The media sits edge-to-edge and the card radius clips it.
Share
Book
aspectRatio media
A 16:9 region that stays proportional as the card resizes.
Actions alignment
Actions align to the trailing edge by default.
Back
Next
Previous
AppBar
Next
List