Beautiful Toast Messages For Vanilla JavaScript

Category: Javascript , Notification | January 13, 2021
Views Total:2,137 views
Official Page:Go to website
Last Update:January 13, 2021


Beautiful Toast Messages For Vanilla JavaScript


A minimal, beautiful, plug & play toast message library created using pure (vanilla) JavaScript.

See Also:

How to use it:

1. Load the vanilla-toast.min.js script in the document and we’re ready to go.

<script src="lib/vanilla-toast.min.js"></script>

2. Create toast messages as follows.

vt.success("Success Message");"Info Message");
vt.warn("Warning Message");
vt.error("Error Message");

3. Available options to customize your toast messages.

  • title: Toast Title
  • position: TopCenter, TopLeft, TopRight, BottomCenter, BottomLeft, BottomRight
  • duration: Auto dismiss the toast after 2 seconds
  • closable: Determine whether the toast message is dismissable
  • focusable: Determine whether the toast message is focusable
  • callback: Trigger a function when the toast message is dismissed
vt.success("Success Message",{
  title: undefined,
  position: toastPosition.TopCenter,
  duration: 2000,
  closable: true,
  focusable: true,
  callback: undefined

You Might Be Interested In:

Leave a Reply