<?= $this->include('partials/html') ?>

<head>
    <?php echo view("partials/title-meta", array("title" => "Solar Icons")) ?>

    <?= $this->include('partials/head-css') ?>
</head>

<body>
    <!-- Begin page -->
    <div class="wrapper">

        <?= $this->include('partials/menu') ?>

        <!-- ============================================================== -->
        <!-- Start Page Content here -->
        <!-- ============================================================== -->

        <div class="page-content">

            <!-- Start Content-->
            <div class="page-container">

                <div class="d-flex flex-wrap gap-3 justify-content-center icon-box">
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="4k">
                            <iconify-icon icon="solar:4k-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>

                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Accessibility">
                            <iconify-icon icon="solar:accessibility-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Accumulator">
                            <iconify-icon icon="solar:accumulator-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Add Circle">
                            <iconify-icon icon="solar:add-circle-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Archive">
                            <iconify-icon icon="solar:archive-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Armchair">
                            <iconify-icon icon="solar:armchair-2-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Asteroid">
                            <iconify-icon icon="solar:asteroid-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Atom">
                            <iconify-icon icon="solar:atom-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Backpack">
                            <iconify-icon icon="solar:backpack-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Backspace">
                            <iconify-icon icon="solar:backspace-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bacteria">
                            <iconify-icon icon="solar:bacteria-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bag 2">
                            <iconify-icon icon="solar:bag-2-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Balloon">
                            <iconify-icon icon="solar:balloon-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Balls">
                            <iconify-icon icon="solar:balls-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Banknote">
                            <iconify-icon icon="solar:banknote-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bar Chair">
                            <iconify-icon icon="solar:bar-chair-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Basketball">
                            <iconify-icon icon="solar:basketball-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bath">
                            <iconify-icon icon="solar:bath-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bed">
                            <iconify-icon icon="solar:bed-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bell Bing">
                            <iconify-icon icon="solar:bell-bing-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bill">
                            <iconify-icon icon="solar:bill-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bill Check">
                            <iconify-icon icon="solar:bill-check-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bolt">
                            <iconify-icon icon="solar:bolt-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bomb">
                            <iconify-icon icon="solar:bomb-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Book 2">
                            <iconify-icon icon="solar:book-2-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
                            <iconify-icon icon="solar:bookmark-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Boombox">
                            <iconify-icon icon="solar:boombox-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bottle">
                            <iconify-icon icon="solar:bottle-outline" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bowling">
                            <iconify-icon icon="solar:bowling-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Box">
                            <iconify-icon icon="solar:box-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Broom">
                            <iconify-icon icon="solar:broom-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bug">
                            <iconify-icon icon="solar:bug-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bus">
                            <iconify-icon icon="solar:bus-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Calculator">
                            <iconify-icon icon="solar:calculator-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Camera">
                            <iconify-icon icon="solar:camera-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Card">
                            <iconify-icon icon="solar:card-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cardholder">
                            <iconify-icon icon="solar:cardholder-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cart 2">
                            <iconify-icon icon="solar:cart-2-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Case">
                            <iconify-icon icon="solar:case-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cassette">
                            <iconify-icon icon="solar:cassette-2-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cat">
                            <iconify-icon icon="solar:cat-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Chair 2">
                            <iconify-icon icon="solar:chair-2-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Chart 2">
                            <iconify-icon icon="solar:chart-2-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Chat Dots">
                            <iconify-icon icon="solar:chat-dots-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Checklist">
                            <iconify-icon icon="solar:checklist-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="City">
                            <iconify-icon icon="solar:city-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cloud">
                            <iconify-icon icon="solar:cloud-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Code File">
                            <iconify-icon icon="solar:code-file-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Command">
                            <iconify-icon icon="solar:command-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Compass">
                            <iconify-icon icon="solar:compass-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Condicioner">
                            <iconify-icon icon="solar:condicioner-2-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Confetti">
                            <iconify-icon icon="solar:confetti-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Copyright">
                            <iconify-icon icon="solar:copyright-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Corkscrew">
                            <iconify-icon icon="solar:corkscrew-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cosmetic">
                            <iconify-icon icon="solar:cosmetic-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Course Up">
                            <iconify-icon icon="solar:course-up-linear" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="CPU">
                            <iconify-icon icon="solar:cpu-bold" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Crop">
                            <iconify-icon icon="solar:crop-bold-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Crown">
                            <iconify-icon icon="solar:crown-line-broken" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                    <div class="card mb-0">
                        <div class="card-body d-flex flex-column align-items-center justify-content-center"
                            data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Cup First">
                            <iconify-icon icon="solar:cup-first-line-duotone" class="fs-2"></iconify-icon>
                        </div>
                    </div>
                </div>

                <div class="my-3 text-center">
                    <a href="https://icon-sets.iconify.design/solar/" target="_blank" class="btn btn-danger">View All
                        Icons</a>
                </div>

            </div> <!-- container -->

            <?= $this->include('partials/footer') ?>

        </div>

        <!-- ============================================================== -->
        <!-- End Page content -->
        <!-- ============================================================== -->

    </div>
    <!-- END wrapper -->

    <?= $this->include('partials/customizer') ?>

    <?= $this->include('partials/footer-scripts') ?>

</body>

</html>