Group related content in a container.
Card description goes here
This is the card content area where you can place any content.
123456789101112131415161718192021Card with background
This card has a background color.
Card with border only
This card has only a border, no background.
1234567891011121314151617181920212223242526272829303132Card description goes here
This is the card content area where you can place any content.
12345678910111213141516171819202122232425262712345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667| Component | Prop | Type | Default | Description |
|---|---|---|---|---|
Card | children | React.ReactNode | — | Card content (required) |
Card | className | string | — | Additional CSS classes |
CardHeader | children | React.ReactNode | — | Header content (required) |
CardHeader | className | string | — | Additional CSS classes |
CardTitle | children | React.ReactNode | — | Title text (required) |
CardTitle | className | string | — | Additional CSS classes |
CardDescription | children | React.ReactNode | — | Description text (required) |
CardDescription | className | string | — | Additional CSS classes |
CardContent | children | React.ReactNode | — | Main content (required) |
CardContent | className | string | — | Additional CSS classes |
CardFooter | children | React.ReactNode | — | Footer content (required) |
CardFooter | className | string | — | Additional CSS classes |