
An opinionated toast component for React with stacking that feels physical.
Sonner is Emil Kowalski's toast component for React, rendered once at the root of an app and triggered from anywhere with a single function call. Toasts stack into a compact pile that expands on hover, swipe away in a direction that follows their position, and come in success, error, promise and custom types. Design engineers read the source, and Emil's write-up on how it was built, to learn how small timing and spacing decisions make a notification feel physical.
- Type
- Library
- Category
- Component libraries
- Patterns
- Toast, Notifications, Micro-interactions
- Style
- Minimal
- Built with
- React, TypeScript
- Platform
- Web
- Added
- Sep 17, 2026
- People
- Emil Kowalski
How it's built
Toasts stack with CSS transforms and expand on hover; swipe-to-dismiss uses pointer velocity.






