Modal

Use Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.

Toggle a working modal demo by clicking the button below. It will slide down and fade in from the top of the page.

Live Demo

Scrolling long content

When modals become too long for the user’s viewport or device, they scroll independent of the page itself. Try the demo below to see what we mean.

Live Demo

Vertically centered

Add .modal-dialog-centered to .modal-dialog to vertically center the modal.

Default Modal

Modal title

Modal body text goes here.

Large Modal

Modal title

Modal body text goes here.

Small Modal

Modal title

Modal body text goes here.