Yami UI

Displays a callout for user attention.

Heads up!

You can add components to your app using the CLI.

Installation

Add the alert component with the shadcn CLI.

npx shadcn@latest add https://yami.ui.unsanity.ai/r/alert.json

Usage

import { TerminalIcon } from "lucide-react"

import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"

<Alert className="w-80">
  <TerminalIcon />
  <AlertTitle>Heads up!</AlertTitle>
  <AlertDescription>You can add components to your app using the CLI.</AlertDescription>
</Alert>

Examples

Destructive

Error

Your session has expired. Please log in again.

Code

import { TerminalIcon } from "lucide-react"

import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"

<Alert variant="destructive" className="w-80">
  <TerminalIcon />
  <AlertTitle>Error</AlertTitle>
  <AlertDescription>Your session has expired. Please log in again.</AlertDescription>
</Alert>