React-Toastify

Easy toast notifications for React applications

toast

Simple API with rich customization. Supports promises and updates.

ReactToastNotificationsAlerts

🎮 Playground

import { toast, ToastContainer } from "react-toastify"
import "react-toastify/dist/ReactToastify.css"

export default function Demo() {
  return (
    <>
      <button onClick={() => toast("Hello!")}>
        Show Toast
      </button>
      <ToastContainer />
    </>
  )
}

Open Sandbox

Use cases

•User notifications
•Form submissions
•API responses

Good for

✓Quick integration
✓Multiple notification types
✓Promise-based actions

Not good for

✗Complex notification centers
✗Headless implementations

Installation

$ npm install react-toastify

Example

import { toast, ToastContainer } from "react-toastify"
import "react-toastify/dist/ReactToastify.css"

export default function Demo() {
  return (
    <>
      <button onClick={() => toast("Hello!")}>
        Show Toast
      </button>
      <ToastContainer />
    </>
  )
}

Comparison

"More features than react-hot-toast, simpler setup than custom solutions."

Trust Metrics

12.5K

GitHub Stars

2.1M

Weekly Downloads

Last Commit:last year

Used by

AtlassianIntercomHotjar

View on GitHub View on npm