nifty-modal

npm i nifty-modal

import Modal from 'nifty-modal'
import 'nifty-modal/dist/index.css';

const modal = new Modal({
  content: '<h1>hello, world<h1/>',
  theme: 'simple',
  animation: 'scale',
  easing: 'easeOutCubic',
  transitionTime: 300,
  closeButton: true,
  container: document.body,
});

modal.open();
modal.close();
modal.toggle();

Themes:

• simple
• bloody
• sky
• forest
• orchid
• ivory
• sunny

Easings:

• easeInSine
• easeInOutBack
• easeInExpo
• easeInQuart
• easeInBack
• easeInCirc
• easeOutQuint
• easeOutCubic
• easeOutSine

Animations:

• fade
• slideLeft
• slideTop
• slideBottom
• slideRight
• scale
• rotate