Skip to main content

Countdown

Square only

By adding data-countdown attribute you can initialise the component. There are two available options, data-end-date and data-end-message.

You can choose between two date format: December 31, 2023 23:59:59 or 2023-12-31T23:59:59.000Z.
By adding any tags with days, hours, minutes or seconds the countdown numbers will appear and start counting down.

Let's Begin!
<div class="row" data-countdown data-end-date="December 31, 2023 23:59:59" data-end-message="Let's Begin!">
    <div class="col-auto">
        <div class="row">
            <div class="col-auto"><strong class="days">0</strong> days</div>
            <div class="col-auto"><strong class="hours">0</strong> hours</div>
            <div class="col-auto"><strong class="minutes">0</strong> minutes</div>
            <div class="col-auto"><strong class="seconds">0</strong> seconds</div>
        </div>
    </div>
</div>