Card
Displays a card with header, content, and footer.
Installation
$npx maddex add Card
Login Form
The default card composition mirrors the shadcn login example, using CardAction for a secondary path and CardFooter for stacked actions.
Preview
Size
Use size="sm" for a more compact layout while keeping the same CardHeader, CardContent, and CardFooter structure.
Preview
Small Card
This card uses the small size variant.
Preview
The card component supports a size prop that can be set to "sm" for a more compact appearance.
Updated 5m ago
Image
Place media before CardHeader to build a featured card while keeping the same semantic slots for content and footer actions.
Preview
Featured
Community event
Design systems meetup
A practical talk on component APIs, accessibility, and shipping faster.
Join a walkthrough of reusable UI patterns, layout composition, and implementation details behind a polished component library.
May 14 · 6:30 PM