Stepper
Stepper blocks: compare
Every Stepper block side by side: whether it follows the theme or stays dark, the stock parts it is built on, and whether it is free. Open one for its preview, props and install.
Compare
| Block | Theme | Uses | Access |
|---|---|---|---|
| Application Status | Light and dark | Badge, Card | Licensed |
| Checkout | Light and dark | Button, Card, Field, … | Free |
| Checkout Bars | Light and dark | Button, Card, Field, … | Free |
| Compact Steps | Light and dark | Button, Card, Field, … | Free |
| Domain Setup | Light and dark | Badge, Button, Card, … | Free |
| Domain Setup Bars | Light and dark | Badge, Button, Card, … | Free |
| Import Wizard | Light and dark | Badge, Button, Table | Free |
| Import Wizard Bars | Light and dark | Badge, Button, Table | Free |
| Install Guide | Light and dark | Button | Free |
| Orb Steps | Light and dark | Its own markup | Licensed |
| Repo Deploy | Light and dark | Button, Field, Input | Licensed |
| Repo Deploy Bars | Light and dark | Button, Field, Input | Free |
| Setup Progress | Light and dark | Button, Card | Free |
| Signup Wizard | Light and dark | Button, Checkbox, Field, … | Licensed |
| Signup Wizard Bars | Light and dark | Button, Checkbox, Field, … | Free |
| Upload Stages | Light and dark | Button | Free |
| Workspace Setup | Light and dark | Button, Card, Input | Free |
All Stepper blocks
17 blocks, A to Z.
Application StatusLicensedRead-only application tracker card for one applicant: their name with a Planet Avatar seeded from it, the role and applied date, a stage badge, a four-step stepper at Interview and a note about the next meeting.
CheckoutFreeFour-step checkout card (cart, shipping, payment, review) with numbered, clickable step triggers that turn to checks. Each step validates with react-hook-form and zod before Continue.
Checkout BarsFreeBars twin of Checkout: the same four steps validated with react-hook-form and zod, but progress is a row of rail segments with screen-reader titles instead of numbered triggers.
Compact StepsFreeSmall new-project card that walks three steps (name, details, access) with a row of dot indicators and the current step title beside them, for dialogs where a full stepper is too loud.
Domain SetupFreeCustom-domain card in three numbered steps: enter the domain, copy the A and CNAME records from a monospace block, then verify with a pending or active badge. The check is a stand-in.
Domain Setup BarsFreeSegmented-bar version of Domain Setup: the same domain, DNS record and verification panels in a card, with progress drawn as bars and step titles kept for screen readers.
Import WizardFreeFour-step CSV contact import with numbered triggers: a drop zone that reads the file's name and row count in the browser, a column mapping table, a preview table and an import step.
Import Wizard BarsFreeBars variant of Import Wizard: CSV upload with an in-browser row count, column mapping, a preview table and import confirmation, tracked by a segmented rail rather than numbered steps.
Install GuideFreeVertical, non-linear install checklist with a shadcn CLI command in a monospace block under each open step. Done, next ticks the step and moves focus to the following title.
Orb StepsLicensedHorizontal pill stepper for Account, Workspace and Invite team where each step's indicator is a Cloudy Nimbus disc: coral, lilac and moss. Done steps fill ink, the current step wears a ring, upcoming steps stay bare; the row stands alone, so your own form submit drives the step.
Repo DeployLicensedThree-step deploy flow (connect, configure, deploy) whose indicators are Orbital v4 orbs, dim ahead and haloed when current. The last step plays a timed build log in place of your API.
Repo Deploy BarsFreeBars twin of Repo Deploy: repository, branch and root-directory fields, then a monospace build log that fills on a timer, with progress drawn as segments instead of orb indicators.
Setup ProgressFreeOnboarding checklist card with a read-only segmented bar counting done tasks, struck-through completed items, inline actions for open ones, a revealable CLI command and a Hide control.
Signup WizardLicensedFour-step signup form (account, profile, preferences, done) validated per step with react-hook-form and zod, where each step indicator is a Cloudy Nimbus disc that takes a check when done.
Signup Wizard BarsFreeBars version of Signup Wizard: email and password, profile, preference checkboxes and a welcome step, validated with react-hook-form and zod and tracked by plain rail segments.
Upload StagesFreeCompact file-upload card with three accent-colored bar segments for uploading, processing and ready. The current segment pulses while its stage runs and holds still under reduced motion.
Workspace SetupFreeVertical onboarding stepper in a card: each of four steps opens a panel with an input, a primary action and a do-this-later option; skipped steps keep an open ring instead of a check.
Orbital Wordmark Neon Sign
A full-height dark section with one large neon sign spelling ORBITAL, one letter set to flicker on its own. The sign burns steady unless animation is switched on.
Application Status
Read-only application tracker card for one applicant: their name with a Planet Avatar seeded from it, the role and applied date, a stage badge, a four-step stepper at Interview and a note about the next meeting.