Tools / UI Kit / Bootstrap / Accordions

Accordions

Basic, icon, colored, nested and FAQ-style accordions.

Basic Accordion

WebNexa is a collection of free online tools that run entirely in your browser.

Yes. Every tool is 100% free — no hidden fees.
<div class="accordion" id="accBasic">
    <div class="accordion-item">
        <h2 class="accordion-header">
            <button class="accordion-button"
                    type="button"
                    data-bs-toggle="collapse"
                    data-bs-target="#accBasic1">
                What is WebNexa?
            </button>
        </h2>

        <div id="accBasic1"
             class="accordion-collapse collapse show">
            <div class="accordion-body">
                WebNexa is a collection of free online tools.
            </div>
        </div>
    </div>
</div>
Flush Accordion

We ship worldwide. Standard delivery is 3–5 business days.

Return within 30 days for a full refund.
<div class="accordion accordion-flush" id="accFlush">
    <div class="accordion-item">
        ...
    </div>
</div>
Always Open (No Group)

Yes — remove data-bs-parent to allow multiple items to remain open at once.

Bootstrap accordions require Bootstrap JavaScript.
<!-- Remove data-bs-parent to allow multiple open at once -->

<div id="accNG1"
     class="accordion-collapse collapse show">
    ...
</div>
Accordion With Custom Icon

Learn the basics in under 5 minutes.

All tools run locally in your browser.
<button class="accordion-button"
        type="button"
        data-bs-toggle="collapse"
        data-bs-target="#accIcon1">

    <i class="fas fa-rocket me-2 text-primary"></i>
    Getting Started

</button>