Multiple Toasters

React Hot Toast supports having multiple toaster instances in your app. This allows you to have different toast configurations and positions for different parts of your application.

Basic Usage

You can create multiple toasters by giving each one a unique toasterId:

<Toaster toasterId="area1" />
<Toaster toasterId="area2" />


// Create a toast in area 1
toast('Notification for Area 1', { toasterId: 'area1' })