Vibe UI
Initializing Vibe UI System...

Toast

Toast displays high-priority status notifications.

Toast

Toast displays high-priority status notifications.

Preview

    Installation

    pnpm dlx vibe-ui-kit@latest add toast button
    💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: button

    Preset Variations

    Glassmorphic

      Retro Neobrutalism

        Neon Glow


          Premium Use Case Examples

          1. Interactive Trigger Toast controller

            2. Action confirmation toast dialog

              3. Destructive warning critical error

                4. Background processing progress loader

                  5. Sound audio volume status

                    6. User Verification code validation

                      7. Interactive Viewport Positioning

                      Toasts can be dispatched to specific screen coordinates using the position prop on <ToastViewport>. Supported options are top-left, top-right, top-center, bottom-left, bottom-right, and bottom-center.

                      Interactive Viewports

                      Select a position to dispatch a global notification.

                                  Contributors

                                  JS
                                  Jenish Sabhadiya

                                  Theme Customizer

                                  8px
                                  @theme {
                                    --radius: 0.5rem;
                                    --glass-blur: 8px;
                                  }
                                  Changes apply instantly to this documentation workspace.
                                  Toast | Vibe UI