Introduction

Vue Final Modal is a tiny, renderless, mobile-friendly, feature-rich modal component for Vue.js.
You can create a higher-order component easily and can customize template, script and style based on your needs.

Checkout the new documentation: https://v4.vue-final-modal.org/

Looking for a Vue 2 version? It's over here

Features

Support Vue 3, Vue 2 and Nuxt

Tailwind CSS friendly

Renderless component

Tiny bundle size

Support stackable, detachable, scrollable, draggable, resizable, transition, accessibility, focusTrap, dynamic modal

Enjoy light and dark mode:

Live Demo

Development

# Clone repo
git clone https://github.com/vue-final/vue-final-modal.git

# Run linter
yarn lint

# Run unit test
yarn test

# Build library
yarn
yarn build

# Run examples
cd examples
yarn
yarn dev

# Run docs
cd docs
yarn
yarn dev

Contribution

Thank you to all the people who already contributed to vue-final-modal!

Made with contributors-img.

To develop vue-final-modal, I learn a lot from these awesome libraries:

Vuetify
- attach
Element UI
- stackable modal
- zIndex
- zIndexBase
vue-js-modal
- dynamic modal
- transition
- focusTrap for A11y
body-scroll-lock
- lockScroll
vue-resizable
- drag & resize

There is no perfect library even the final of vue modal.