vue-toastflow

Framework-agnostic toast engine with a Vue 3 renderer. Typed core, smooth stack animations, CSS-first theming, and full control over layout and behavior.
17,273 207
Install
npm install vue-toastflow
Latest Version:1.3.0
Vue:3
License:MIT
Last Updated:Aug 31, 2026
Links: GitHub  ·  npm
Maintainer: adrianjanocko

💚 Using Nuxt? Install nuxt-toastflow instead — it wraps this package with auto-imports and SSR support.

createToastflow() injects Toastflow's default CSS by default. Pass createToastflow(config, { css: false }) to disable that and import vue-toastflow/styles.css manually only when you want the shipped styles.

📦 What's Included

Feature
🔌 createToastflow plugin
🎯 toast programmatic API
🧱 <ToastContainer /> · <Toast /> · <ToastProgress />
🎨 Default styles and icon components

🚀 Quick Start

1. Install

pnpm add vue-toastflow

2. Register the plugin

// main.ts
import { createApp } from "vue";
import App from "./App.vue";
import { createToastflow } from "vue-toastflow";

createApp(App).use(createToastflow()).mount("#app");

3. Use it ✨

<!-- App.vue -->
<script setup lang="ts">
import { ToastContainer, toast } from "vue-toastflow";

toast.success({ title: "Saved", description: "Your changes are live." });
</script>

<template>
  <ToastContainer />
</template>

💡 See the full Vue Quick Start guide for theming, slots, events, and more.

📄 License

MIT — made with ❤️ by @adrianjanocko

Related Packages

@meforma/vue-toaster

Vue.js toaster notification

217,174 192
@datagouv/vue-toaster

Vue 3 toaster notification

859 0
nuxt-toastflow

Nuxt module for Toastflow — accessible, customizable toast notifications with au...

2,507 207
@incuca/vue3-toaster

Lightweight toast-notification plugin for Vue 3

5,317 5

Version History

Version Released License
1.3.0 MIT
1.2.1 MIT
1.2.0 MIT
1.1.9 MIT
1.1.8 MIT
Pre-releases (17)
Version Released License
1.2.0-beta.6 MIT
1.2.0-beta.5 MIT
1.2.0-beta.4 MIT
1.2.0-beta.3 MIT
1.2.0-beta.2 MIT