Basic Stepper

A horizontal multi-step progress indicator with numbered circle indicators and separators, used to guide users through a sequence of steps like a checkout or onboarding flow.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Basic Stepper to your project and fits it to your theme.

import Pattern from "@/components/ui/c-stepper-1";

export default function Demo() {
  return <Pattern />;
}