Theme Switcher

Alert

Displays a callout for user attention.

Default
This is a default alert.
Danger
This is a danger alert.
Info
This is an info alert.
Success
This is a success alert.
Warning
This is a warning alert.
<Alert>
	<Rocket className="h-6 w-6" />
	<AlertContent>
		<AlertTitle>Default</AlertTitle>
		<AlertDescription>This is a default alert.</AlertDescription>
	</AlertContent>
</Alert>
<Alert priority="danger">
	<Fire className="h-6 w-6" />
	<AlertContent>
		<AlertTitle>Danger</AlertTitle>
		<AlertDescription>This is a danger alert.</AlertDescription>
	</AlertContent>
</Alert>
<Alert priority="info">
	<Info className="h-6 w-6" />
	<AlertContent>
		<AlertTitle>Info</AlertTitle>
		<AlertDescription>This is an info alert.</AlertDescription>
	</AlertContent>
</Alert>
<Alert priority="success">
	<CheckCircle className="h-6 w-6" />
	<AlertContent>
		<AlertTitle>Success</AlertTitle>
		<AlertDescription>This is a success alert.</AlertDescription>
	</AlertContent>
</Alert>
<Alert priority="warning">
	<Warning className="h-6 w-6" />
	<AlertContent>
		<AlertTitle>Warning</AlertTitle>
		<AlertDescription>This is a warning alert.</AlertDescription>
	</AlertContent>
</Alert>

API Reference

PropTypeDefault
priority

"danger"

"default"

"info"

"success"

"warning"

"default"