The most simple way to display a countdown in angular 9

Usage no npm install needed!

<script type="module">
  import ngxSimpleCountdown from '';


Angular Simple Countdown (ngx-simple-countdown)

The most simple way to display a countdown in angular 10-11

Getting Started



npm i ngx-simple-countdown
yarn i ngx-simple-countdown

Import in your angular module (or feature module)

import { NgxSimpleCountdownModule } from 'ngx-simple-countdown';

  imports: [NgxSimpleCountdownModule]
export class AppModule {}

Add "simpleCountdown" in a new div in your component

<div class="countdown" simpleCountdown [dateTo]="1581242400"></div>

  convert your date to timestamps 

And you can add some parameters

  [endMessage]="'custom end message'"
    font-size: 20px;
    color: red;
    background-color: white;
    padding: 10px 4px;
    font-weight: bold;

Parameters Docs

type Name parameter default value custom value
input language en en/English - fr/Francais - pl/Polski - de/Deutschland - es/España - pt/Portugal - cs/Česká republika - ge/Georgian
input endMessage "countdown finish" custom the end message (or empty message)
input reactive true false (remove seconds and minutes)
input styles "font-size:20px;color:#FFF;background-color:#000;padding:10px 5px;font-weight:bold" remplace my default
output finish x callback when the countdown was finish

if your language is not supported please contact me

Add styles in your div


you can add somes styles in your element

.countdown {
  border: 2px solid red;
  position: absolute;
  top: 0;
  right: 0;

And that's it, Enjoy !

Questions ? contact me