Standard & Sizing Modals

Launch standard Bootstrap modals with different size variations (`.modal-sm`, `.modal-lg`, `.modal-xl`).

Alignment & Scrolling Behavior

Vertically centered modal dialogs, scrollable content bodies, and static backdrop triggers.

Form Inputs & Multi-Step Toggle

Embed interactive form inputs inside modals or chain multiple modals together.

Theme & Contextual Alert Modals

Contextual alert dialogs styled with Spark Admin brand colors.

Reusable Code Snippets

Copy and paste these modal markup snippets directly into your workspace files.

Standard Modal Window
<div class="modal fade" id="myModal" tabindex="-1"> <div class="modal-dialog modal-dialog-centered"> <div class="modal-content"> <div class="modal-header"><h5 class="modal-title">Title</h5></div> </div> </div> </div>
Dark Forest Theme Modal
<div class="modal-dialog modal-dialog-centered"> <div class="modal-content modal-content-forest"> <div class="modal-header"><h5 class="modal-title text-white">Forest Theme</h5></div> </div> </div>