Full-page guided setup with sidebar progress, step panels, and mobile step dots.

Example

Let's personalize your experience

Tell us a bit about you so we can tailor templates, suggestions, and features to your needs.

Step 1 of 5

Multi-Step Form Page includes:

Sidebar (large screens): Gradient rail with step list and completion state.
Step flow: Role & use case, template, data source, first flow, and invite team.
Navigation: Continue / back between steps; optional steps marked in the list.
Mobile chrome: Bottom step dots and “Step X of Y” when the sidebar is hidden.

Uses Button, Input, Label, Textarea, Badge, and layout primitives.

import { MultiStepFormPage } from "@/components/ui/multi-step-form-page";

<MultiStepFormPage />;