Toastry Sonner-Style Stacked Toast Notification Library Examples

Download Back To CSSScript.Com

Lightweight JavaScript Toast Notification Library Create Sonner-style stacked toast notifications in JavaScript with swipe dismissal, promise states, action buttons, and CSS variable theming.

Toast Variants

Click any control to render a live toast.

Position and Queue

Four corners, visible stack limit, swipe-friendly layout.

Custom Toast Composer

Message, type, duration, icon, and action.

Use 0 for a toast that stays visible until dismissed.

Theme Preview

Toast colors are adjusted with CSS variables for this dark demo.

toast.configure({ position: "bottom-right", duration: 4200, maxVisible: 3, maxToasts: 6 });
toast.success("Report exported", {
  description: "The CSV file is ready for download.",
  action: { label: "Open", onClick: () => toast.info("Opening report") }
});