Introduction
Guide.js is a React component for building product tours, onboarding flows, and contextual help experiences. It is designed to be embedded directly into your app with minimal configuration and zero backend requirements.
Why Guide.js?
Section titled “Why Guide.js?”- Stateless component. Pass in steps, render the
<Guide>component. No stores, no providers, no side effects you didn’t opt into. - Multiple step types. Dialog, popover, tooltip, modal, and spotlight.
- Flexible targeting. Anchor steps to any DOM element using CSS selectors.
- Composable. Use render props to inject your own footer, branding, or controls.
- Themeable. Style with CSS variables or override classes.
- TypeScript-first. Fully typed with no
anys.
When to reach for Guide.js
Section titled “When to reach for Guide.js”Guide.js is a good fit when you want:
- A new-user onboarding walkthrough.
- Feature spotlights for newly released functionality.
- Contextual help that appears on demand.
- A “show me around” experience in a complex UI.
If you need a heavier solution with analytics, A/B testing, and a hosted dashboard, look at Userorbit Tours.