Sunflower UI
Search
Copy Code
Light Mode
!
Heads up
Your workspace has been updated.
alert-demo.tsx
alert.tsx
prompt.md
Collapse
Reset
Copy Code
Download
Run
1
"use client";
2
3
import { Alert } from "./alert"
4
5
export function AlertDemo() {
6
return (
7
<div className="flex items-center justify-center min-h-[400px] bg-zinc-50 dark:bg-black p-8">
8
<Alert
9
className="max-w-md w-full shadow-sm"
10
title="Heads up"
11
description="Your workspace has been updated."
12
icon={
13
<div className="w-[22px] h-[22px] bg-amber-500 rounded-md flex items-center justify-center text-black shadow-sm">
14
<span className="text-[13px] font-bold">!</span>
15
</div>
16
}
17
/>
18
</div>
19
)
20
}
21