Progress 3
Horizontal completion tracker
A horizontal stepper that shows progress at a glance. Steps are laid out left to right with a thin connecting line. Completed steps use filled circular check icons, while the current or pending step uses a neutral indicator. Each step includes a short title and supporting description beneath it, balancing status clarity with explanatory context. Best suited for onboarding or checkout flows where users benefit from seeing what’s done and what’s left.
Production-ready by default
Built with shadcn/ui conventions and designed for real projects.
Clean React components using Tailwind and modern shadcn patterns.
Add the block directly using the shadcn CLI.
Compatible with shadcn themes and token-based color systems.
Use shadcn MCP server right from your favorite AI tools.






