<button class="sw_btn sw_modal-toggler bg-amber_gold st-white sw_rsq-1" data-toggle="modal" data-target="#modal1">Modal Button1</button>
<button class="sw_btn sw_modal-toggler bg-light_mint st-white sw_rsq-1" data-toggle="modal" data-target="#modal2">Modal Button2</button>
<button class="sw_btn sw_modal-toggler bg-lime st-white sw_rsq-1" data-toggle="modal" data-target="#modal3">Modal Button3</button>
<button class="sw_btn sw_modal-toggler bg-ivory st-white sw_rsq-1" data-toggle="modal" data-target="#modal4">Modal Button4</button>
<button class="sw_btn sw_modal-toggler bg-taupe st-white sw_rsq-1" data-toggle="modal" data-target="#modal5">Modal Button5</button>

<div class="sw_modal popsize-5" id="modal1">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-content">
            <h1>Modal Hello</h1>
            <hr class="sw_hr">
            ...
        </div>
    </div>
</div>

<div class="sw_modal popsize-4 sw_rsq-2" id="modal2">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-header">
            <button class="sw_close modal_close" data-close="modal"></button>
        </div>
        <div class="sw_modal-content">
            <h1>Modal Hello</h1>
            <hr class="sw_hr">
            ...
        </div>
    </div>
</div>

<div class="sw_modal popsize-3 sw_rsq-2 bg-celery" id="modal3">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-content">
            <h1>Modal Hello</h1>
            <hr class="sw_hr">
            ...
        </div>
    </div>
</div>

<div class="sw_modal popsize-2 bg-tan st-white sw_rsq-3 st_align-justify" id="modal4">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-header"><span class="close-modal" data-close="modal">
            <i class="fa-solid fa-xmark"></i>
        </span>
        </div>
        <div class="sw_modal-content">
            ...
        </div>
    </div>
</div>

<div class="sw_modal popsize-1 bg-teal st-white sw_rsq-3 st_align-justify" id="modal5">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-header"><span class="sw_close" data-close="modal">
        </span>
        </div>
        <div class="sw_modal-content">
            ...
        </div>
    </div>
</div>


                

                    
<button class="sw_btn sw_modal-toggler bg-amber_gray st-white sw_rsq-1" data-toggle="modal" data-target="#modal6">Modal Button6</button>
<button class="sw_btn sw_modal-toggler bg-chalk sw_rsq-1" data-toggle="modal" data-target="#modal7">Modal Button7</button>
<button class="sw_btn sw_modal-toggler bg-amber_red st-white sw_rsq-1" data-toggle="modal" data-target="#modal8">Modal Button8</button>
<button class="sw_btn sw_modal-toggler bg-thistle st-white sw_rsq-1" data-toggle="modal" data-target="#modal9">Modal Button9</button>

<div class="sw_modal modal-slide popsize-5 bg-lochmara st_align-justify" id="modal6">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-header bg-antique_white"><span class="sw_close" data-close="modal"></span>
            <h3>Swavy Modal Header</h3>
        </div>
        <div class="sw_modal-content st-white">
           ...
        </div>
    </div>
</div>

<div class="sw_modal popsize-4 modal-sweep bg-gainsboro st_align-justify" id="modal7">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-header bg-turquoise st-white">
            <h3>Swift Modal Header</h3>
        </div>
        <div class="sw_modal-content">
            ...
        </div>
        <div class="sw_modal-footer bg-aquamarine"><h3>Swift Modal Footer</h3></div>
    </div>
</div>

<div class="sw_modal popsize-3 bg-sienna modal-zoom st_align-justify" id="modal8">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-content st-white">
           ...
        </div>
        <div class="sw_modal-footer bg-tomato st-white">
            <button class="sw_btn bg-brick_red st-white sw_rsq-2 sw_no-br st_space-1">Change</button>
            <button class="sw_btn bg-brick_red st-white sw_rsq-2 sw_no-br st_space-1 sw_right" data-close="modal">Close</button>
        </div>
    </div>
</div>

<div class="sw_modal sw_modal-scroll-y popsize-2 bg-army_green modal-sweep st_align-justify" id="modal9">
    <div class="sw_modal-wrapper">
        <div class="sw_modal-content st-white">
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maiores eius repudiandae expedita,
            recusandae deserunt cum maxime veniam possimus commodi
            atque autem alias culpa ducimus dolores placeat excepturi impedit dignissimos dolore?
        </div>
        <div class="sw_modal-footer bg-sea_green st-white"><h3>Swift Modal Footer</h3></div>
    </div>
</div>