Card

Displays a card with header, content, and footer. Containers for displaying content and actions about a single subject.

Source Code

Sync In Progress

Started 3 mins ago

Events Found

Events Expired

Compile Progress

In Progress

Sources Checked

210 out of 340

Installation


pnpm dlx radianui@latest add card

Usage

Imports

/components/ui/card.tsx

import {
	Card,
	CardAction,
	CardContent,
	CardDescription,
	CardFooter,
	CardHeader,
	CardTitle,
} from "@/components/ui/card"

Code

/components/ui/card.tsx

<Card>
	<CardHeader>
		<CardTitle>Card Title</CardTitle>
		<CardDescription>Card Description</CardDescription>
		<CardAction>Card Action</CardAction>
	</CardHeader>
	<CardContent>
		<p>Card Content</p>
	</CardContent>
	<CardFooter>
		<p>Card Footer</p>
	</CardFooter>
</Card>