Growth & Conversion
Countdown Urgency Banner
An inline deadline banner for a sale or launch window that counts down and then degrades gracefully to a plain closing message the instant it ends — never a broken negative-time state. Dismissible and remembered for the session.
$ velocityx add countdown-urgency-banner
Built for react.
Needs react already installed
as a peer dependency.
An Astro-only project needs @astrojs/react wired up first — this won't run on its own in plain Astro.
Full docs for Countdown Urgency Banner →
Needs a licence key —
subscribe here, then
velocityx loginonce.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| deadline | string | Date | Yes | ISO 8601 deadline. Anything `Date` can parse. | |
| eyebrow | string | No | 'Limited time' | |
| message | string | No | 'This offer closes soon.' | Message shown while the countdown is live. |
| expiredMessage | string | No | 'This offer has ended — check back for the next one.' | Message shown once the deadline has passed. |
| ctaText | string | No | ||
| ctaHref | string | No | ||
| dismissible | boolean | No | true | |
| storageKey | string | null | No | 'velocity.countdownbanner.dismissed' | sessionStorage key used to remember a dismissal. Set null to disable persistence. |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/countdown-urgency-banner/CountdownUrgencyBanner.tsxUsing the Countdown Urgency Banner component
Install it with velocityx add countdown-urgency-banner.
The CLI writes the source straight into your project — no runtime dependency, no registry
lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.
Related components
More from Growth & Conversion.
A persistent top-docked bar that resurfaces a cart left behind on any route, showing item count and total with Resume and Clear actions — a cross-page return nudge, not a cart panel.
reactA bottom-docked banner that nudges mobile visitors to open or install the native app, with iOS/Android-aware copy and store links, and a dismissal that snoozes for two weeks instead of forever.
reactA claim-to-reveal discount code card with one-tap copy and an expiry note, so the offer reads as earned rather than just printed on the page.
reactAn inline day-and-time picker for booking a demo call, showing every slot in the visitor's own detected timezone so nobody has to do the conversion math themselves. Submits the chosen slot to any scheduling backend and ends in a confirmed state.
react