Warning Alert

1import { AlertTriangleIcon } from "lucide-react";
2import { Alert, AlertDescription, AlertTitle } from "@/registry/ui/alert";
3 
4export default function AlertWarningDemo() {
5  return (
6    <Alert className="border-amber-500/50 text-amber-500 dark:border-amber-500 [&>svg]:text-amber-500">
7      <AlertTriangleIcon className="size-4" />
8      <AlertTitle>Proceed with Caution</AlertTitle>
9      <AlertDescription className="text-amber-500">
10        This action might have unintended consequences.
11      </AlertDescription>
12    </Alert>
13  );
14}