Growth & Conversion
Free Trial Progress Nudge
A days-remaining trial card with one upgrade action, whose tone steps from calm to urgent as the account's real trial clock runs down so the nudge gets harder to ignore exactly when it should.
$ velocityx add free-trial-progress-nudge
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 Free Trial Progress Nudge →
Needs a licence key —
subscribe here, then
velocityx loginonce.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| daysRemaining | number | Yes | ||
| totalDays | number | Yes | ||
| planName | string | No | 'Pro' | |
| upgradeHref | string | Yes | ||
| onDismiss | () => void | No | ||
| dismissible | boolean | No | true | |
| storageKey | string | null | No | 'velocity.trialnudge.dismissed' |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/free-trial-progress-nudge/FreeTrialProgressNudge.tsx Using the Free Trial Progress Nudge component
Install it with velocityx add free-trial-progress-nudge.
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.
reactAn 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.
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.
react