PHPackages jeremykenedy/laravel-toast - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Mail & Notifications](/categories/mail) 4. / 5. jeremykenedy/laravel-toast ActiveLibrary[Mail & Notifications](/categories/mail) jeremykenedy/laravel-toast ========================== Multi-framework toast notifications for Laravel with Tailwind, Bootstrap 5, Bootstrap 4, Blade, Livewire, Vue, React, and Svelte support. v1.0.0(3mo ago)16MITBladePHP ^8.2|^8.3CI passing Since Apr 1Pushed 3mo agoCompare [ Source](https://github.com/jeremykenedy/laravel-toast)[ Packagist](https://packagist.org/packages/jeremykenedy/laravel-toast)[ RSS](/packages/jeremykenedy-laravel-toast/feed)WikiDiscussions main Synced 4w ago READMEChangelog (2)Dependencies (7)Versions (6)Used By (0) ![Laravel Toast](art/banner-light.svg) Powerful, highly configurable toast notifications for Laravel with 56 animations, 19 per-toast props, RTL support, dark mode, and full CSS/frontend framework parity. [![Total Downloads](https://camo.githubusercontent.com/423acc784c008982c7ee06c7571a639d4b02ce16654b24311e80a94081f3c2cc/68747470733a2f2f706f7365722e707567782e6f72672f6a6572656d796b656e6564792f6c61726176656c2d746f6173742f642f746f74616c2e737667)](https://packagist.org/packages/jeremykenedy/laravel-toast) [![Latest Stable Version](https://camo.githubusercontent.com/49603c300849cf90ae4e97da0040820faa85470a13f54b5599edd4efb298f9c4/68747470733a2f2f706f7365722e707567782e6f72672f6a6572656d796b656e6564792f6c61726176656c2d746f6173742f762f737461626c652e737667)](https://packagist.org/packages/jeremykenedy/laravel-toast) [![Tests](https://github.com/jeremykenedy/laravel-toast/actions/workflows/tests.yml/badge.svg)](https://github.com/jeremykenedy/laravel-toast/actions) [![StyleCI](https://camo.githubusercontent.com/30002b1b9d852bab10965c356e02402860fc02fcce7ad18429e2216c383d7962/68747470733a2f2f6769746875622e7374796c6563692e696f2f7265706f732f313139353034393134332f736869656c643f6272616e63683d6d61696e)](https://github.styleci.io/repos/1195049143?branch=main) [![License: MIT](https://camo.githubusercontent.com/fdf2982b9f5d7489dcf44570e714e3a15fce6253e0cc6b5aa61a075aac2ff71b/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d4d49542d79656c6c6f772e737667)](https://opensource.org/licenses/MIT) Table of Contents ----------------- [](#table-of-contents) - [Framework Support](#framework-support-matrix) - [Installation](#installation) - [Quick Start](#quick-start) - [Configuration](#configuration) - [Props Reference](#props-reference) - [Animations](#animations) - [Dark Mode](#dark-mode) - [Customizing Colors](#customizing-colors) - [Usage](#usage) - [Changing Frameworks](#changing-frameworks) - [Artisan Commands](#artisan-commands) - [Testing](#testing) - [License](#license) Framework Support ----------------- [](#framework-support) Every CSS and frontend combination is fully supported with identical features: Blade + Alpine.jsLivewire 3Vue 3React 18Svelte 4**Tailwind v4**✅✅✅✅✅**Bootstrap 5**✅✅✅✅✅**Bootstrap 4**✅✅✅✅✅**15 combinations. Zero feature gaps.** Requirements ------------ [](#requirements) - PHP 8.2+ - Laravel 12 or 13 - One CSS framework: Tailwind v4, Bootstrap 5, or Bootstrap 4 - One frontend: Blade + Alpine.js, Livewire 3, Vue 3, React 18, or Svelte 4 Installation ------------ [](#installation) ``` composer require jeremykenedy/laravel-toast php artisan toast:install ``` Add to your layout before ``: ``` @include('toast::toasts') ``` Or with the directive: `@toasts` For Livewire: `` Quick Start ----------- [](#quick-start) ``` // In any controller, service, or middleware toast('Settings saved.'); toast('Upload failed.', 'error', 'Error'); toast('Heads up!', 'warning', null, 3000); // Fluent chaining toast()->success('Step 1 done.')->info('Starting step 2...'); // Facade Toast::success('Created!'); Toast::error('Denied.', 'Access Error'); ``` Existing flash messages work automatically: ``` return back()->with('success', 'Profile updated.'); // Displays as a success toast with no code changes ``` Configuration ------------- [](#configuration) ``` php artisan vendor:publish --tag=toast-config ``` Every config option is also an ENV variable and a per-toast prop override: ``` TOAST_POSITION=top-right TOAST_DIR=ltr TOAST_DURATION=5000 TOAST_AUTO_DISMISS=true TOAST_PAUSE_ON_HOVER=true TOAST_STACK=true TOAST_SHOW_ICONS=true TOAST_SHOW_BORDER=true TOAST_SHOW_CLOSE=true TOAST_SHOW_PROGRESS=true TOAST_PROGRESS_DIRECTION=rtl TOAST_PROGRESS_POSITION=top TOAST_OPACITY=1 TOAST_ENTER_ANIMATION=none TOAST_ENTER_DURATION=0.5 TOAST_EXIT_ANIMATION=none TOAST_EXIT_DURATION=0.5 TOAST_MAX_VISIBLE=5 ``` Props Reference --------------- [](#props-reference) All props work as global config defaults AND per-toast overrides. PropDefaultOptions`position``top-right``top-left` `top-right` `top-center` `bottom-left` `bottom-right` `bottom-center``dir``ltr``ltr` `rtl``duration``5000`Milliseconds (0 = no auto-dismiss)`auto_dismiss``true``true` `false``pause_on_hover``true``true` `false``stack``true``true` (accumulate) `false` (replace)`max_visible``5`Any integer`show_icon``true``true` `false``custom_icon``null`Raw SVG HTML string`show_border``true``true` `false``show_close``true``true` `false``show_progress``true``true` `false``progress_direction``rtl``rtl` `ltr``progress_position``top``top` `bottom``opacity``1``0` to `1``enter_animation``none`See [Animations](#animations)`enter_duration``0.5`Seconds`exit_animation``none`See [Animations](#animations)`exit_duration``0.5`Seconds### Per-Toast Override [](#per-toast-override) ``` toast()->success('Saved!', 'Done', 3000, [ 'position' => 'bottom-right', 'dir' => 'rtl', 'show_border' => false, 'show_close' => false, 'enter_animation' => 'slide-right', 'enter_duration' => 0.3, 'exit_animation' => 'bounce-left', 'exit_duration' => 0.5, 'progress_position' => 'bottom', 'opacity' => 0.9, ]); ``` Animations ---------- [](#animations) 56 animation styles available for both `enter_animation` and `exit_animation`. Directionless names (e.g., `slide`, `bounce`) use a sensible default (typically center or right): StyleEnterExit`none`Instant appearInstant remove**Fade**`fade`Fade inFade out`fade-center`Fade in (alias)Fade out (alias)**Slide**`slide`Slide in from right (default)Slide out to right (default)`slide-left`Slide in from leftSlide out to left`slide-right`Slide in from rightSlide out to right`slide-top`Slide in from topSlide out to top`slide-bottom`Slide in from bottomSlide out to bottom**Bounce**`bounce`Scale up, overshoot, settle (default)Scale up, overshoot, shrink (default)`bounce-left`Overshoot from left then settleBounce right then exit left`bounce-right`Overshoot from right then settleBounce left then exit right`bounce-top`Overshoot from top then settleBounce down then exit top`bounce-bottom`Overshoot from bottom then settleBounce up then exit bottom`bounce-center`Scale up, overshoot, settleScale up, overshoot, shrink**Shrink**`shrink`Scale up from center (default)Scale down to center (default)`shrink-left`Expand from right edgeCollapse toward right edge`shrink-right`Expand from left edgeCollapse toward left edge`shrink-top`Expand from bottom edgeCollapse toward bottom edge`shrink-bottom`Expand from top edgeCollapse toward top edge`shrink-center`Scale up from centerScale down to center**Flip** (3D)`flip`Flip in 180 Y-axis (default)Flip out 180 Y-axis (default)`flip-left`Flip in from right (Y-axis)Flip out to left (Y-axis)`flip-right`Flip in from left (Y-axis)Flip out to right (Y-axis)`flip-top`Flip in from bottom (X-axis)Flip out to top (X-axis)`flip-bottom`Flip in from top (X-axis)Flip out to bottom (X-axis)`flip-center`Flip in 180 (Y-axis)Flip out 180 (Y-axis)**Spin**`spin`Spin in + scale up (default)Spin out + scale down (default)`spin-left`Spin in from leftSpin out to left`spin-right`Spin in from rightSpin out to right`spin-top`Spin in from topSpin out to top`spin-bottom`Spin in from bottomSpin out to bottom`spin-center`Spin in + scale upSpin out + scale down**Grow**`grow`Scale up from center (default)Scale down to center (default)`grow-left`Scale up from right edgeScale down toward right edge`grow-right`Scale up from left edgeScale down toward left edge`grow-top`Scale up from bottom edgeScale down toward bottom edge`grow-bottom`Scale up from top edgeScale down toward top edge`grow-center`Scale up from centerScale down to center**Slam** (overshoot)`slam`Scale from 0, overshoot 120%, settle (default)Overshoot 115%, scale to 0 (default)`slam-left`Fly in from left, overshoot 115%, settleOvershoot 115%, fly out left`slam-right`Fly in from right, overshoot 115%, settleOvershoot 115%, fly out right`slam-top`Fly in from top, overshoot 115%, settleOvershoot 115%, fly out top`slam-bottom`Fly in from bottom, overshoot 115%, settleOvershoot 115%, fly out bottom`slam-center`Scale from 0, overshoot 120%, settleOvershoot 115%, scale to 0**Wobble**`wobble`Wobble side-to-side then appear (default)Wobble side-to-side then disappear`wobble-left`Wobble in from leftWobble then exit left`wobble-right`Wobble in from rightWobble then exit right`wobble-top`Wobble in from topWobble then exit top`wobble-bottom`Wobble in from bottomWobble then exit bottom`wobble-center`Wobble + scale up from centerWobble + scale down to centerEnter and exit animations have independent duration controls (`enter_duration`, `exit_duration`). Dark Mode --------- [](#dark-mode) All three CSS frameworks support dark mode: **Tailwind v4** uses `dark:` variant classes automatically. No extra setup needed. **Bootstrap 5** uses `text-bg-*` classes that respect `[data-bs-theme="dark"]`. Add to your `` tag: ``` ``` **Bootstrap 4** uses inline styles for dark mode. The toast views detect `.dark` on the body class or `prefers-color-scheme: dark` media query. Customizing Colors ------------------ [](#customizing-colors) ### Tailwind v4 [](#tailwind-v4) Override toast colors via your `app.css` with theme accent variables or direct utility overrides: ``` /* Light mode */ .toast-success { @apply bg-emerald-50 text-emerald-900 border-emerald-300; } .toast-error { @apply bg-rose-50 text-rose-900 border-rose-300; } /* Dark mode */ .dark .toast-success { @apply bg-emerald-950 text-emerald-100 border-emerald-700; } .dark .toast-error { @apply bg-rose-950 text-rose-100 border-rose-700; } ``` Or publish and edit the views directly: ``` php artisan vendor:publish --tag=toast-views # Edit resources/views/vendor/toast/tailwind/blade/toasts.blade.php ``` ### Bootstrap 5 [](#bootstrap-5) Override Bootstrap contextual colors in your stylesheet: ``` /* Light mode */ .toast.text-bg-success { background-color: #d1fae5 !important; color: #065f46 !important; } .toast.text-bg-danger { background-color: #fee2e2 !important; color: #991b1b !important; } /* Dark mode */ [data-bs-theme="dark"] .toast.text-bg-success { background-color: #064e3b !important; color: #d1fae5 !important; } [data-bs-theme="dark"] .toast.text-bg-danger { background-color: #7f1d1d !important; color: #fee2e2 !important; } ``` ### Bootstrap 4 [](#bootstrap-4) Override Bootstrap 4 alert colors: ``` /* Light mode */ .alert-success { background-color: #d1fae5; border-color: #6ee7b7; color: #065f46; } .alert-danger { background-color: #fee2e2; border-color: #fca5a5; color: #991b1b; } /* Dark mode */ .dark .alert-success, @media (prefers-color-scheme: dark) { .alert-success { background-color: #064e3b; border-color: #047857; color: #d1fae5; } } .dark .alert-danger, @media (prefers-color-scheme: dark) { .alert-danger { background-color: #7f1d1d; border-color: #b91c1c; color: #fee2e2; } } ``` Usage ----- [](#usage) ### Facade [](#facade) ``` use Jeremykenedy\LaravelToast\Facades\Toast; Toast::success('Saved.'); Toast::error('Failed.', 'Error'); Toast::warning('Low storage.'); Toast::info('Update available.'); Toast::clear(); ``` ### HasToasts Trait [](#hastoasts-trait) ``` use Jeremykenedy\LaravelToast\Traits\HasToasts; class UserController extends Controller { use HasToasts; public function update(Request $request, User $user) { $user->update($request->validated()); $this->toastSuccess('User updated.'); return back(); } } ``` ### Livewire Events [](#livewire-events) ``` // From any Livewire component $this->dispatch('toast', message: 'Saved!', type: 'success'); $this->dispatch('toast-success', message: 'Created!'); $this->dispatch('toast-error', message: 'Failed!'); // With per-toast options $this->dispatch('toast', message: 'RTL toast', type: 'info', options: [ 'dir' => 'rtl', 'exit_animation' => 'slide-left', ]); ``` ### Vue / React / Svelte [](#vue--react--svelte) Pass toasts via Inertia props or `window.__toasts`: ``` // Controller return Inertia::render('Dashboard', [ 'toasts' => app(ToastManager::class)->get(), ]); ``` ``` window.__toasts = @json(app(ToastManager::class)->get()); ``` Changing Frameworks ------------------- [](#changing-frameworks) After installation, use **update** or **switch** to change frameworks without losing configuration. ### Update (Interactive) [](#update-interactive) The update command walks through framework selection with an interactive menu: ``` php artisan toast:update ``` Or pass options directly: ``` php artisan toast:update --css=bootstrap5 --frontend=vue ``` OptionValuesDescription`--css``tailwind`, `bootstrap5`, `bootstrap4`Change CSS framework`--frontend``blade`, `livewire`, `vue`, `react`, `svelte`Change frontend framework### Switch (Quick) [](#switch-quick) ``` php artisan toast:switch --css=bootstrap5 php artisan toast:switch --frontend=livewire php artisan toast:switch --css=tailwind --frontend=vue ``` After switching, run `npm run build`. Artisan Commands ---------------- [](#artisan-commands) CommandDescription`toast:install`Fresh install with interactive prompts. Detects existing installation.`toast:update`Update framework selection interactively. Does not overwrite config.`toast:switch`Quick framework switch via flags.### Install Options [](#install-options) FlagDescription`--css=`CSS framework: `tailwind`, `bootstrap5`, `bootstrap4``--frontend=`Frontend: `blade`, `livewire`, `vue`, `react`, `svelte``--force`Skip reinstall confirmation when already installed### Publishing Assets [](#publishing-assets) ``` php artisan vendor:publish --tag=toast-config php artisan vendor:publish --tag=toast-views php artisan vendor:publish --tag=toast-lang ``` Testing ------- [](#testing) ``` ./vendor/bin/pest --ci ``` License ------- [](#license) This package is open-sourced software licensed under the [MIT license](LICENSE). ### Health Score 39 — LowBetter than 85% of packages Maintenance82 Actively maintained with recent releases Popularity6 Limited adoption so far Community8 Small or concentrated contributor base Maturity53 Maturing project, gaining track record Bus Factor1 Top contributor holds 83.3% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~0 days Total 2 Last Release 91d ago Major Versions v0.5.0 → v1.0.02026-04-01 ### Community Maintainers ![](https://www.gravatar.com/avatar/05cef7d9ee65723b129042943511207fb34db74a56afbf67b5900987f758c161?d=identicon)[jeremykenedy](/maintainers/jeremykenedy) --- Top Contributors [![jeremykenedy](https://avatars.githubusercontent.com/u/6244570?v=4)](https://github.com/jeremykenedy "jeremykenedy (15 commits)")[![StyleCIBot](https://avatars.githubusercontent.com/u/11048387?v=4)](https://github.com/StyleCIBot "StyleCIBot (3 commits)") --- Tags laravelnotificationslivewiretailwindflashbootstrapreactvuetoastsvelte ### Code Quality TestsPest Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/jeremykenedy-laravel-toast/health.svg) ``` [![Health](https://phpackages.com/badges/jeremykenedy-laravel-toast/health.svg)](https://phpackages.com/packages/jeremykenedy-laravel-toast) ``` ### Alternatives [psalm/plugin-laravel Psalm plugin for Laravel 3355.3M341](/packages/psalm-plugin-laravel)[moonshine/moonshine Laravel administration panel 1.3k253.1k78](/packages/moonshine-moonshine)[livewire/flux The official UI component library for Livewire. 9527.8M124](/packages/livewire-flux)[roots/acorn Framework for Roots WordPress projects built with Laravel components. 9762.4M125](/packages/roots-acorn)[hasinhayder/tyro-dashboard Tyro Dashboard - Beautiful admin dashboard for managing Tyro roles, privileges, users, and settings 5443.8k](/packages/hasinhayder-tyro-dashboard)[ascsoftw/livewire-toast Livewire Package to display Toast Notifications 48545.9k1](/packages/ascsoftw-livewire-toast) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)