Toast
A modern, layered toast system for React.
@th1n/toast is a minimal notification library with expressive status styles, smooth stacking motion and sensible defaults.
What it includes
- Four ready-to-use variants: success, info, warning and error.
- Layered stack animation that expands on hover.
- Optional category labels, descriptions, grain and custom icons.
- A small global API, backed by a React provider.
Start here
Install the package, add one ToastProvider close to the root of your app, then trigger a toast anywhere in its React tree.
import { ToastProvider, toast } from "@th1n/toast";
export function App() {
return (
<ToastProvider>
<button onClick={() => toast.success("Changes saved")}>Save</button>
</ToastProvider>
);
}Use the sidebar for setup and the interactive playground to try every option.