Onboarding
Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
Unlock this block—Get Pro at 60% off
React Onboarding Guided Walkthrough
Guided walkthrough with step-by-step instructions, visual highlights, and progress navigation
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Guide users with this walkthrough component. Features numbered instruction steps, visual element highlights, progress dots, and navigation controls. Built with shadcn/ui Card, Button, and Badge. Perfect for feature introductions, interactive tutorials, or guided app experiences.
Step 1 of 5
Your Dashboard
This is your home base. You'll see all your projects and recent activity here.
Click anywhere to continue
Installation
Related blocks you will also like
React Onboarding Stepper
Linear stepper
React Onboarding Progress
Progress bar style
React Onboarding Carousel
Feature carousel
React Onboarding Tour
Feature tour
React Onboarding Completion
Completion celebration
React Onboarding Shortcuts
Keyboard shortcuts