Skip to main content
Gooey Toast Hero Light

​
Overview

Gooey Toast is a feature-rich toast notification component for Laravel that brings delightful animations and extensive customization to your application. Built with Alpine.js and zero external CSS dependencies, it works seamlessly with any tech stack.
This package is currently under active development. APIs may change before the stable release.

​
Key features

Gooey Toast provides everything you need for sophisticated toast notifications:

Unique animations

SVG gooey blob animations with per-type entrance effects including slide, shake, and bounce

Expandable details

Show key-value detail rows, message blocks, and footer text in expandable toast bodies

Action buttons

Add clickable buttons with custom icons, colors, and confirmation flows

Progress tracking

Display progress bars that update in real-time for long-running operations

Promise integration

Automatically handle loading, success, and error states from JavaScript promises

Undo functionality

Give users a chance to undo actions with countdown timers and confirmation events

Custom colors

Override type colors with custom hex values and switch between dark/light themes

Mobile vibration

Trigger device vibrations on mobile with custom patterns for important notifications

​
Framework support

Gooey Toast supports modern Laravel versions and works with or without Livewire:
  • Laravel 10, 11, and 12
  • PHP 8.1 or higher
  • Alpine.js (included with Livewire, or add manually)
  • Optional: Livewire for enhanced integration

​
Toast types

Each toast type comes with its own color scheme and entrance animation:
TypeColorAnimation
successGreenSmooth slide-up
errorRedSlide-up with shake
warningAmberSlide-up with bounce
infoBlueSmooth slide-up
loadingGraySmooth slide-up (spinner icon)

​
Quick example

Here’s a taste of what you can build with Gooey Toast: 
toast({
  type: 'success',
  title: 'Deployment complete',
  details: [
    { label: 'Environment', value: 'Production' },
    { label: 'Branch', value: 'main' },
  ],
  footer: 'https://deploy.example.com/logs/3f8a2c1',
});

​
Get started

Ready to add beautiful toast notifications to your Laravel app? Start with the installation guide:

Installation

Install Gooey Toast via Composer and add the component to your layout

Quick start

Create your first toast notification in under 5 minutes

Build docs developers (and LLMs) love

Get started for freeTalk to us