67 Open Source Modal Window Plugins Made with jQuery, JavaScript, CSS, and more!

Written by: Julia Chen Julia Chen 

Keep tabs on our content. One or two emails a week:

Modals are flexible windows that sit on top of a product’s main window, interacting with users without disrupting their flow. Modal windows are great for welcome messages, images, and videos. Modals are often designed with a layer of transparency behind them, providing a peek of the main screen, but they can also take over the entire screen and command full attention.

You can build code-free modal windows with Appcues. We can wholeheartedly recommend our own product because it’s seriously a great way to create gorgeous, customizable modals (and more) that improve user onboarding and engagement. All without bugging your dev team.

If you want to go the open source route, here are 67 options to check out:

JBox jQuery Plugin for Modals

jBox jQuery modal

Language(s): jQuery
What we like about it: A powerful and flexible jQuery plugin that features modal windows and tooltips.
Link: http://stephanwagner.me/jBox

Modal.js for Bootstrap

BootstrapJS Modal

Language(s): JavaScript
What we like about it: One of the most popular open source tools for creating a modal dialog.
Link: http://getbootstrap.com/javascript/

Vex

Vex

Language(s): CSS, JavaScript
What we like about it: Easy-to-customize modal dialogs with a clean, modern look.
Link: http://github.hubspot.com/vex/docs/welcome/

Reveal Modal

Reveal_modal.png

Language(s): jQuery
What we like about it: Popular and easy-to-use jQuery modal plugin.
Link: http://foundation.zurb.com/sites/docs/v/5.5.3/components/reveal.html

Joyride

Joyride modalLanguage(s): jQuery
What we like about it: Very popular resource for tooltips and modals.
Link: http://foundation.zurb.com/sites/docs/v/5.5.3/components/joyride.html

Website Tour with jQuery

Codrops_modal.png

Language(s): jQuery
What we like about it: Give website tours using modals and tooltips.
Link: http://tympanus.net/codrops/2010/12/21/website-tour/

jQuery TourBus

jQuery TourBus

Language(s): jQuery
What we like about it: Gives you full control of your web walkthrough with modals and tooltips.
Link:  http://ryanfunduk.com/jquery-tourbus/

jQuery Plugin "modalBox"

modalBox.png

Language(s): jQuery
What we like about it: A very simple jQuery dialog.
Link:   http://opensource.steffenhollstein.de/templates/modalbox/

Ouibounce

Ouibounce-modal.png

Language(s): JavaScript, CSS
What we like about it: A small library for creating popup windows upon exit intent.
Link: https://github.com/carlsednaoui/ouibounce

Magnific Popup

Magnific_Popup.png

Language(s): JavaScript, CSS
What we like about it:  A modal popup that users can only leave based on specific actions.
Link: http://dimsemenov.com/plugins/magnific-popup/

CSS Modal

CSS Modal

Language(s): CSS
What we like about it: Customizable modal window with options to add text, photos, and videos.
Link: http://drublic.github.io/css-modal/#

Fallr

Fallr-modal.png

Language(s): jQuery
What we like about it: Simple, bare-bones jQuery modal plugin.
Link: http://amatyran.com/codecanyon/fallr-js/

SimpleModal

simplemodal.png

Language(s): jQuery
What we like about it: Lightweight jQuery plugin that allows customizable CSS.
Link: http://www.ericmmartin.com/projects/simplemodal/

jQuery Modal

jQuery_Modal.png

Language(s): jQuery
What we like about it: Simple jQuery modal that includes styled login forms and unclosable windows.
Link: http://jquerymodal.com

DayPilot.Modal Dialog

DayPilot.Modal Dialog

Language(s): JavaScript
What we like about it: Simple modal dialog that can display HTML or standalone page.
Link: 
https://code.daypilot.org/81367/daypilot-modal

jQuery UI

jQuery UI

Language(s): jQuery
What we like about it: Basic jQuery dialog for forms, messages, and animations.
Link: https://jqueryui.com/dialog/

Nifty Modal Dialog Effects

Nifty Modal Windows Effect

Language(s): JavaScript
What we like about it: Experimental and sleek modal designs.
Link: http://tympanus.net/codrops/2013/06/25/nifty-modal-window-effects/

animatedModal.js

animatedModal

Language(s): JavaScript
What we like about it: Full screen modals with animated transitions.
Link: http://joaopereirawd.github.io/animatedModal.js/

jQuery MessageBox

jQuery MessageBox  

Language(s): jQuery
What we like about it: Plain and straight-forward modal.
Link: http://gasparesganga.com/labs/jquery-message-box/

Remodal

Remodal

Language(s): JavaScript, CSS
What we like about it: Responsive and simple modal plugin with declarative configuration and hash tracking.
Link: http://vodkabears.github.io/remodal/#

SweetAlert

SweetAlert

Language(s): JavaScript, CSS
What we like about it: Popular popup modal that replaces Javascript’s “alert”
Link: http://t4t5.github.io/sweetalert/

Avgrund Modal

Avgrund_Modal.png

Language(s): jQuery
What we like about it: Nice-looking plugin for jQuery popups and modals.
Link: http://labs.voronianski.com/jquery.avgrund.js/

Modal Popups

Super_Simple_Modal_Popups_with_jQuery_and_CSS3_Transitions.png

Language(s): jQuery
What we like about it: Simple, lightweight modal popup.
Link: http://www.jqueryscript.net/lightbox/Super-Simple-Modal-Popups-with-jQuery-CSS3-Transitions.html

Lean Modal

LeanModal

Language(s): jQuery
What we like about it: Super light, bare bones modal dialog window.
Link: http://leanmodal.finelysliced.com.au

jQuery Popdown Plugin

jQuery Popdown Plugin

Language(s): jQuery
What we like about it: Clean jQuery modal window that pops down for a change.
Link: http://wixel.github.io/jquery-popdown/

Colorbox

Colorbox.png

Language(s): jQuery
What we like about it: A jQuery lightbox that’s great for displaying photos.
Link: http://www.jacklmoore.com/colorbox/

SSI-modal

ssi-modal.png

Languages:  jQuery
What we like about it: Responsive, mobile-friendly modal
Link: http://ssbeefeater.github.io/#ssi-modal

jQuery Modal 1.2.3

jQuery Modal 1.2.3

Languages:  jQuery
What we like about it: Simple jQuery modal for alerts, prompts, errors, and animations.
Link: https://github.com/CreativeDream/jquery.modal

Custombox

Custombox

Languages:  JavaScript, jQuery
What we like about it: Created with native JavaScript, works with jQuery and has a lot of animated transition options.
Link: http://dixso.github.io/custombox/ 

BlockUI

 jQuery BlockUI Plugin

Languages:  jQuery
What we like about it: Popup jQuery plugin that prevents users from exiting until they perform certain actions.
Link: http://jquery.malsup.com/block/

nyroModal

nyroModal Languages:  jQuery
What we like about it: Highly customizable modal windows.
Link: http://nyromodal.nyrodev.com

fancyBox

fancyBox.png
Languages:  jQuery
What we like about it: Lightbox alternative, great for images and html content.
Link: http://fancybox.net

jqModal

jqModal

Languages:  jQuery
What we like about it: Super lightweight and flexible modal window.
Link: http://jquery.iceburg.net/jqModal/#examples

Zebra Dialog

Zebra Dialog

Languages:  jQuery
What we like about it: Lightweight dialog box with clean-looking default designs.
Link: http://stefangabos.ro/jquery/zebra-dialog/

moaModal

moamodal

Languages:  jQuery
What we like about it: Small, flexible modals.
Link: http://sweefty.com/moaModal/

Login Modal

Login Modal

Languages:  jQuery, CSS
What we like about it: Login or signin modal dialog window.  
Link: http://www.alessioatzeni.com/wp-content/tutorials/jquery/login-box-modal-dialog-window/index.html

Tinybox 2

Tinybox

Languages: JavaScript
What we like about it: Highly customizable JavaScript modal windows.
Link: http://sandbox.scriptiny.com/tinybox2/

Rmodal

rmodal

Languages: JavaScript
What we like about it: Simple modal with plain JavaScript (no dependencies), and less than 1.2 KB
Link: http://plnkr.co/edit/XXFKwHHcZD4Ecjh8twaW?p=preview

bPopup

bpopup

Languages: jQuery
What we like about it: Simple, lightweight jQuery modal popup.
Link: http://dinbror.dk/bpopup/

ModalPoplite

ModalPoplite

Languages: jQuery
What we like about it: Straight-forward modal popup packed with features.
Link: http://www.mywebdeveloperblog.com/projects/modalpoplite/demo/

FacyBox

facybox

Languages: jQuery
What we like about it: Facebook-like, jQuery modals that can display images, divs, or remote pages.
Link: http://bitbonsai.com/facybox/

ThickBox

ThickBox.png 

Languages: JavaScript, jQuery, CSS
What we like about it: Shows images, galleries, inline content, and iframed content.
Link: http://codylindley.com/thickbox/ 

ngDialog

ngDialog

Languages: JavaScript
What we like about it: Beautiful, clean modals and popups for Angular.js apps.
Link: http://likeastore.github.io/ngDialog/#

Bubble Transition

Bubble

Languages: Swift
What we like about it: Gorgeous bubble transition modal for mobile apps.
Link: https://github.com/andreamazz/BubbleTransition

Noty

noty

Languages: JQuery
What we like about it: Pretty and colorful jQuery popup windows that can be easily positioned.
Link: http://ned.im/noty/#/about

SimpleDialog

SimpleDialog

Languages: jQuery
What we like about it: A no-frills popup window for jQuery mobile.
Link: http://dev.jtsage.com/jQM-SimpleDialog/demos/string.html 

Boxy

boxy

Languages: jQuery
What we like about it: Clean, Facebook-like modal dialog for a variety of functions.
Link: http://onehackoranother.com/projects/jquery/boxy/tests.html#

Popup Dialog Windows

jQuery popup

Languages: jQuery
What we like about it: Simple jQuery modal popups that interact with users.
Link: http://www.ezzylearning.com/tutorial/creating-popup-dialog-windows-using-jquery 

jQuery Impromptu

jQuery Impromptu

Languages: jQuery
What we like about it: Nice jQuery popups for alerts, prompts, and confirmations, meant to complement modals.
Link: http://trentrichardson.com/Impromptu/

Modaal

Modaal

Languages: CSS, jQuery
What we like about it: Accessible and flexible plugin for modal dialog.
Link: http://humaan.com/modaal/

Ply

Ply

Languages: JavaScript
What we like about it: Customizable popup window with multistep options.
Link: http://rubaxa.github.io/Ply/

Flipside

Flipside

Languages: CSS
What we like about it: A CTA button that turns into a modal window.
Link: http://lab.hakim.se/flipside/

jAlert

jAlert

Languages: jQuery
What we like about it: Responsive and easy-to-use jQuery popup form.
Link: http://flwebsites.biz/jAlert/

jQuery confirm

jQuery confirm

Languages: jQuery
What we like about it: A jQuery window with plenty of features.
Link: https://craftpip.github.io/jquery-confirm/

Modal Box with CSS

modalbox_CSS

Languages: CSS3, HTML5
What we like about it: Nice-looking HTML popup.
Link: http://www.webdesignerdepot.com/2012/10/creating-a-modal-window-with-html5-and-css3/

iZiMODAL

IZIMODAL

Languages: CSS, jQuery
What we like about it: Elegant and lightweight jQuery window.
Link: http://izimodal.marcelodolce.com

Backbone.Modal

Backbone

Languages: CSS, JavaScript, HTML
What we like about it: Comes with default behaviors and interaction, built for Backbone.JS.
Link: http://awkward.github.io/backbone.modal/

Popdevelop

Popdevelop

Languages: CSS, JavaScript
What we like about it: Sleek full-screen modal with animation, built with Bootstrap.
Link: http://popdevelop.com/2014/07/sexy-splash-modal-using-bootstrap-css3-and-angularjs/

Subscribe Better

Subscribe Better

Languages: CSS, JavaScript
What we like about it: Highly customizable modal form for collecting subscribers
Link: https://github.com/peachananr/subscribe-better

Angular fancy modal

angular fancy modal

Languages: CSS, JavaScript, HTML
What we like about it: Offers a dozen default options for AngularJS
Link: http://vesparny.github.io/angular-fancy-modal/example/

CSS3-Modal

CSS3 Modal

Languages: CSS
What we like about it: 100% pure CSS modal.
Link: https://github.com/cameronbaney/CSS3-Modal

Morphing Modal

Morphing Modal

Languages: CSS
What we like about it: Very sleek full-screen modal window that opens from a CTA button.
Link: https://github.com/CodyHouse/morphing-modal-window

FModal

FModal

Languages: CSS, JavaScript
What we like about it: Full-screen modals that popup.
Link: https://github.com/abhisack/FModal.js

ZFDragableModalTransition

ZFDragableModalTransition

Languages: Objective-C
What we like about it: Customizable animated modals for mobile.
Link: https://github.com/zoonooz/ZFDragableModalTransition 

QuestionMark

QuestionMark

Languages: JavaScript
What we like about it: Modal window pops up when user hits the question mark key.
Link: https://www.impressivewebs.com/demo-files/question-mark-js/

Vanilla Modal

Vanilla Modal

Languages: JavaScript, CSS
What we like about it: Small, no-frills modal window.
Link: https://github.com/thephuse/vanilla-modal

Tingle

Tingle

Languages: JavaScript
What we like about it: Pure JavaScript modal that looks minimalistic and clean.
Link: http://robinparisi.github.io/tingle/

jsPanel

jsPanel_.png

Languages: jQuery
What we like about it: A customizable jQuery plugin for modals and tooltips.
Link: http://jspanel.de/v2.6.2/

user onboarding academy

The User Onboarding Academy

Everything you need to know about user onboarding in 7 weekly emails.

Recommended reading