Card
In the realm of user interface design, cards are the canvases that display bite-sized content, neatly segmenting information for easy user consumption. Modular by design, these components both showcase content and encourage users to engage.
Examples
Default
Default Card.
card content
Titled Card
Add a title by passing the title prop to the component.
ion design
card content
Detailed Card
Add a subtitle by passing the subtitle prop to the component
ion design
Ship product at the speed of thought
card content
Icon Card
Add an icon by passing the icon prop to the component.
ion design
Ship product at the speed of thought
card content
Installation
Properties
Label
title
string
Title of the Card.
subtitle
string
Description of the Card.
children
React.ReactNode | React.ReactNode[]
Content of the Card.
icon
React.ReactNode
Icon displayed in the Card.
type
"outline"
"filled"
"elevated"
default: "outline"
Type of the Card.
footer
React.ReactNode | React.ReactNode[]
Footer of the Card.
className
string
Classname to style the Card.