Card - Aspect UI

The Card component is a container for displaying content in a structured, elegant layout. It supports headers, footers, media, and custom styling for building dashboards, listings, and feature sections.

Table of Contents#

Default Card#



Simple Card#


Interactive Card#


Card Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card
childrenReact.ReactNodeThe content of the card

CardHeader Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card header
childrenReact.ReactNodeThe content of the card header

CardTitle Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card title
childrenReact.ReactNodeThe content of the card title

CardDescription Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card description
childrenReact.ReactNodeThe content of the card description

CardContent Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card content
childrenReact.ReactNodeThe content of the card content area

CardFooter Props#


PropTypeDefaultDescription
classNamestringAdditional CSS classes to apply to the card footer
childrenReact.ReactNodeThe content of the card footer