10 Best Modal/Popup/Dialog Components For Vue.js (2020 Update)

The modal & popup is one of the most commonly used components in Vue.js that enables you to overlay any content (for example images, ajax contents, important alert messages, etc.) on top of the screen.

Here is a hand-picked collection of 10 best free modal window and dialog/popup box components created for Vue.js based web and mobile apps. Have fun!

Originally published Nov 17 2017,  updated Jan 06 2020

1. vue-js-modal

vue-js-modal

Demo Download

This is an easy yet highly customizable, mobile-friendly modal & dialog component for Vue.js 2+ app. Supports server-side rendering.


2. Vue 2 Simple Alert Component

Vue 2 Simple Alert Component

Demo Download

A simple alert dialog component for Vue.js 2, inspired by SweetAlert.


3. Elegant Animated Modal Component For Vue.js – vodal

vodal

Demo Download

An elegant, responsive, animated modal component for Vue.js that comes with more than 9 fancy animation types powered by CSS3.


4. vue-modal-dialogs

vue-modal-dialogs

Demo Download

vue-modal-dialogs turns dialogs into Promises. Developers can build and control dialogs a lot easier in Vue.js applications. Especially in some complicated situations like controlling multiple dialogs, nested dialogs, etc.


5. iOS Inspired Dialog Component

iOS Inspired Dialog Component

Demo Download

A Vue.js 2+ popup component to create iOS style Alert, Confirm, Toast dialogs with ease.


6. v-dialogs

v-dialogs

Demo Download

A simple and powerful dialog for Vue.js 2+, including Modal, Alert, Mask and Toast.


7. Simple Vue Draggable Dialog Component

Simple Vue Draggable Dialog Component

Demo Download

A simple draggable dialog box component for Vue.js component.


8. vuedals

vuedals

Demo Download

A Vue.js modal component that allows the user to open multiple modal windows at a time.


9. Modaltor

Modaltor

Demo Download

A simple and powerful dialog for Vue.js 2+, including Modal, Alert, Mask and Toast.


10. Vue Popup With CSS Transitions – vue-over-body

vue-over-body Modal

Modal

Demo Download

The vue-over-body project lets you create modals, sidebars, notifications,pop-ups with css transitions.


Conclusion:

Didn’t find a modal component for your app in this list? Don’t forget to check out our Vue.js Modal section for more components.

You Might Be Interested In: