Modals Component
Customizable dialog prompts, notification popups, sizing variants, and interactive modal windows.
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.
<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>
<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>