Feedback · Application UI
Sonner
A themed toast notification provider that wraps the Sonner Toaster with @wrksz/themes integration and custom Phosphor icons for success, info, warning, error, and loading states.
Feature showcase
Installation
Features
9 examples
Default, Custom, Dismissible, Positions, Promise, Rich Colors, Variants, With Action, With Description.
API
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| ...props | ToasterProps | - | All props from Sonner's ToasterProps are forwarded directly to the underlying Toaster (e.g. position, richColors, expand, duration, closeButton, offset). |
Source and related
| File | Path |
|---|---|
| Component | registry/ui/sonner.tsx |
| Default example | content/examples/sonner/default.tsx |
| Custom example | content/examples/sonner/custom.tsx |
| Dismissible example | content/examples/sonner/dismissible.tsx |
| Positions example | content/examples/sonner/positions.tsx |
| Promise example | content/examples/sonner/promise.tsx |
| Rich Colors example | content/examples/sonner/rich-colors.tsx |
| Variants example | content/examples/sonner/variants.tsx |
| With Action example | content/examples/sonner/with-action.tsx |
| With Description example | content/examples/sonner/with-description.tsx |