Components
A minimal, dark-themed toast component with success, error, info, and warning variants using colored gradients and icons to convey status at a glance. It includes a close button and compact layout for non-intrusive, high-visibility notifications.
Loading preview...
import { Component } from "@/components/ui/toast";
export default function DemoOne() {
return (
<div className="flex flex-col gap-6">
<Component id="info-toast" title="Info" description="This is an info toast" type="info" />
<Component id="success-toast" title="Success" description="This is a success toast" type="success" />
<Component id="error-toast" title="Error" description="This is an error toast" type="error" />
<Component id="warning-toast" title="Warning" description="This is a warning toast" type="warning" />
</div>
);
}