Border can have easily changed color, side, alpha opacity, radius or width by adding its corresponding classes. The color palette is taken from material design colors.


Open Dialog

How to use

Trigger on button click

const confirmButton = document.getElementById("confirm-button");
confirmButton.addEventListener("click", (event) => {
        confirm: function(){alert("confirmed")}

Trigger on link click

const confirmLink = document.getElementById("confirm-link");
confirmLink.addEventListener("click", (event) => {


List of available options:

  • title - a title for dialog box
  • content - a text of dialog box
  • confirmText - a text for confirm button
  • cancelText - a text for cancel button
  • confirm - callback function to run when confirmed
  • dialogClasses - array of classes for dialog box
  • confirmClasses - array of classes for confirm button
  • cancelClasses - array of classes for cancel button