Countdown

Angular Bootstrap 5 Countdown plugin

Countdown plugin built with the Bootstrap 5. Examples of timers, counters, stopwatch, number counts, counter box & more.

Note: Read the API tab to find all available options and advanced customization

Basic example

Create default Countdown by adding [countdown] input to a container element with a Countdown expiration date value.

Show code

Interval

Create interval that will reset timer every time initial countdown ends.

Show code

Label

Create label for each time unit by adding [countdownLabel] with a text of your choice.

Show code

Separator

Add [countdownSeparator] input to a container element to insert separator between each time unit.

Separator won't be visible for Countdown column position

Show code

Styling

Countdown position

Change default horizontal position of Countdown with [countdownPosition]="'vertical'"

Show code

Label position

Change default vertical position of Countdown label with [countdownLabelPosition="'horizontal'"]

Show code

Text size

Change default time unit text size (4rem) with [countdownTextSize].

Show code

Custom classes

Add custom classes to time unit value and label with [countdownTextStyle] and [countdownLabelStyle]

Show code