Token Reset
A reset password form that reads a token from the recovery link, confirms it, then collects a new password. Use to complete a tokened email reset flow.
A reset password form that reads a token from the recovery link, confirms it, then collects a new password. Use to complete a tokened email reset flow.
Search blocks by description or jump to a page.
Token Reset is a three-step card that walks a user through completing an email recovery flow. Step one shows a centered key icon, a title, and a single code field where the user enters the 6 to 8 character token from their inbox. Step two swaps the header for a lock icon, confirms identity with a blue alert banner, and presents a new password field and a confirm field, each with an eye toggle to reveal the value. Step three replaces the form with a green confirmation panel and a sign-in button. A small numbered step indicator row with a connecting bar sits above every form so users always know where they are in the sequence.
Each step's header copy, field labels, and helper text are plain strings you can update to match your product's voice. The three-step structure is fixed, but the alert message on step two and the success text on step three can be reworded freely. The "Sign in" and "Contact support" footer links are placeholder anchors you wire to your own routes.
Reach for this block at the end of a tokened email recovery flow, on the route your reset email links to. It suits healthcare scheduling portals and similar regulated products where showing the user explicit confirmation at each gate builds trust before they regain access to sensitive data. Compared to Simple Reset, which assumes the token was already validated server-side, this block surfaces the verification step to the user so they understand why they must act before setting a new password.
A natural flow around it on an Application page:
Before
After
The block covers three distinct moments in one card; here is what you can adapt at each stage:
Tip: wire the "Verify Code" submit handler to a real token validation endpoint before advancing to step two so invalid tokens never reach the password form.