Alert
Displays a callout for user attention.
Heads up!
You can add components to your app using the cli.
Installation
npx shadcn@latest add https://exawizards.com/exabase/design/registry/alert.jsonUsage
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"<Alert>
<Terminal className="h-4 w-4" />
<AlertTitle>Heads up!</AlertTitle>
<AlertDescription>
You can add components and dependencies to your app using the cli.
</AlertDescription>
</Alert>API
Props of the div element are also available.
| Prop | Type | Default | Description |
|---|---|---|---|
variant | "default" | "success" | "info" | "warning" | "error" | default | The variant of the alert. |
Examples
Variant
Default
This is a default alert.
Success
Your changes have been saved.
Info
New features are now available.
Warning
This API will be deprecated soon.
Error
Something went wrong. Please try again.
Elements
Title
Title
Description
Title
Title
Description