10 Best Snackbar Plugins In jQuery And Pure JavaScript (2023 Update)

by jQueryScript,

What Is Snackbar

Snackbar is a contextual notification UI component introduced in the Google Material Design that provides brief messages about app processes at the bottom of the screen.

Snackbars inform users of a process that an app has performed or will perform. They appear temporarily, towards the bottom of the screen. They shouldn’t interrupt the user experience, and they don’t require user input to disappear.

In general, a snackbar will automatically dismiss after a timeout just like a temporary notification popup

It also contains an action button which allows the user to interact with your web app.

The Best Snackbar Plugin

This is a list of 10 best jQuery and pure (Vanilla) JavaScript plugins that makes it simple to display customizable Material Design inspired snackbars on the web applications.

If you're developing an Android or Material Design styled web app, you might find useful. 

Originally Published July 30, 2019, updated Jan 11 2023

Table of contents:

jQuery Snackbar Plugins:

Material Design Inspired jQuery Snackbar and Toast Plugin - snackbarjs

snackbarjs is a lightweight jQuery plugin to create Google Material Design style snackbars and toasts that automatically disappear after a timeout.

Material Design Inspired jQuery Snackbar and Toast Plugin - snackbarjs

[Demo] [Download]


Snackbar Notification Component For jQuery - js-snackbar

js-snackbar is a really small JavaScript (jQuery) plugin which provides an easy way to create Android & Material Design snackbar notifications with custom action support.

Snackbar Notification Component For jQuery - js-snackbar

[Demo] [Download]


Bootstrap 5 Toast & Snackbar Manager - jQuery Toast.js

The upgraded version of the Script47's jQuery Toast plugin that helps you generate Android style snackbars and toasts in the fresh new Bootstrap 5 framework.

Bootstrap 5 Toast & Snackbar Manager - jQuery Toast.js

[Demo] [Download]


Lightweight Android Style Snackbar Plugin For jQuery - Smackbar

A super small (~2kb) jQuery plugin used to create Android and Material Design inspired snackbars that will automatically disappear after a timeout or after user interaction.

Lightweight Android Style Snackbar Plugin For jQuery - Smackbar

[Demo] [Download]


Simple Snackbar Style Alert Box Plugin For jQuery

A simple jQuery notification plugin to create customizable, CSS animated notification boxes inspired by Material Design Snackbars.

Simple Snackbar Style Alert Box Plugin For jQuery

[Demo] [Download]


Vanilla JS Snackbar Plugins:

Beautiful Google Inspired Snack Bar In JavaScript – Snackbar.js

A pretty nice Android inspired snack bar component that shows feedback messages to your users with custom action/callback support.

Beautiful Google Inspired Snack Bar In JavaScript – Snackbar.js

[Demo] [Download]


Smooth Snackbar & Toast Notification In JavaScript – js-snackbar

A pure JavaScript plugin that helps you create Material Design inspired non-blocking snackbars & toast notifications on the web app.

Smooth Snackbar & Toast Notification In JavaScript – js-snackbar

[Demo] [Download]


Simple Interactive Snackbar & Toast Notification In Vanilla JavaScript – notifyjs

A vanilla JS notification plugin that shows Material Snackbar and Toasts style notification messages to the user.

Simple Interactive Snackbar & Toast Notification In Vanilla JavaScript – notifyjs

[Demo] [Download]


Sliding Toaster & Snackbar In JavaScript – toastnotify

A tiny notification plugin to create Google-style toasts and snackbars sliding from the left side of the screen when triggered.

Sliding Toaster & Snackbar In JavaScript – toastnotify

[Demo] [Download]

Google Style Toast & Snackbar Popup In JavaScript – Material Toast

Yet another Google Material inspired toast & snackbar plugin written in Vanilla JavaScript.

Google Style Toast & Snackbar Popup In JavaScript – Material Toast

[Demo] [Download]


Conclusion:

Seeking more jQuery plugins or JavaScript libraries to create awesome Snackbar Notifications on the web & mobile? See jQuery Snackbar and JavaScript Snackbar sections for more details.

See Also: