Modals

ModalModals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.

A rendered modal with header, body, and set of actions in the footer.

Modal title

Curabitur blandit mollis lacus. Nulla sit amet est. Suspendisse nisl elit, rhoncus eget, elementum ac, condimentum eget, diam. Donec mi odio, faucibus at, scelerisque quis, convallis in, nisi. Cras sagittis.



Modals have two optional sizes, available via modifier classes to be placed on a.modal-dialog.

Modal - DefaultModal - SmallModal - Large


Other Examples

Without AnimationPrevent Outside Click


Optional Colors

Make sure to give the available color in modal's data-attribute 'data-modal-color'