Back

Countdown

Sizes

00
:
00
:
00
:
00
00
:
00
:
00
:
00
00
:
00
:
00
:
00

sm · md · lg

With labels

00 Days
:
00 Hrs
:
00 Min
:
00 Sec

Brand variant with labels

00 Days
:
00 Hrs
:
00 Min
:
00 Sec

Usage

Alpine's init() starts a 1-second interval; destroy() clears it automatically on unmount.

@display.Countdown(display.CountdownProps{
    TargetDate:  "2026-12-31T23:59:59", // any Date()-parseable string
    ShowLabels:  true,                  // show Days / Hrs / Min / Sec labels
    Size:        "md",                  // "sm" | "md" | "lg"
    Variant:     "default",             // "default" | "brand"
})