Development · Web app
Sonner
An opinionated, polished toast notification component for React.
Sonner is an open-source React toast library designed with refined animations and stacking behavior. It provides an intuitive API for standard, promise-based, and actionable notifications, and serves as the default toast implementation in shadcn/ui.
What it's for
- Display user feedback and alert notifications in React web applications
- Show asynchronous loading and success/error states using promise toasts
- Add undo actions and interactive buttons to transient UI alerts
Features
- Stacked toast layout with customizable visible toast limits
- Built-in support for success, info, warning, error, and promise states
- Configurable screen positioning with directional swipe-to-dismiss
- Rich color presets and optional close buttons
- Headless rendering mode for custom styling
- Lightweight setup with a single root Toaster component
Pricing
Open source. Free and open source (MIT)
Details
- Type
- Web app
- Category
- Development
- Topic
- UI Components
- Open source
- Yes
- Platforms
- Code library
- For
- React frontend developers and UI designers
- Alternative to
- react-hot-toast, react-toastify
- Tags
- react, toast, notifications, ui, shadcn, components
Why it was saved
- @shadcn: Polished, well-crafted toast component with clean animations and API — 'the last toast component you'll ever need' — and it ships with shadcn/ui.
Related
Copy-paste React UI components built with Tailwind CSS and Radix primitives.
Pre-built, responsive shadcn/ui blocks and layouts for React applications
Open-source animation library for React, Vue, and vanilla JavaScript
Open-source animated and interactive React UI components and backgrounds
Curated directory of crafted React, Tailwind, and shadcn UI components.
Open-source animated React icons built with Lucide and Motion
Updated