Trial Status Card
A trial card with a day meter, a ruled list of what the team set up, an end date outcome, and an add payment action.
A trial card with a day meter, a ruled list of what the team set up, an end date outcome, and an add payment action.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Trial Status Card is the in-trial billing panel for the Acme workspace, showing day 9 of a 14 day Team plan trial on a Progress meter (with a 5 days left badge) and a ruled list of what the team already set up: 3 teammates invited, 2 projects created, Slack connected, and 1.4 GB imported. A dated outcome section spells out what happens on Jul 15, the workspace pauses in read only mode with nothing charged or deleted, and the header carries the add payment method action. The footer offers a one time extension by replying to the trial email.
The trial length and days used are standalone consts that drive the meter percentage and its aria label. The setup list is a plain array, and the end of trial paragraph is the piece that turns a countdown into a decision the user can trust.
Reach for this block at the top of the billing overview during an active trial, wired to your trial and subscription state. Show it only while the trial is running, and swap the meter, end date, and outcome copy once a payment method is on file.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the countdown for a self serve trial. Other trial surfaces:
Tip: state the exact end date outcome; users convert faster when they know nothing is charged or deleted by surprise.