NPM Package

Mursa Guide

A lightweight React library for creating interactive product tours and user onboarding experiences. Guide your users through your app with beautiful step-by-step walkthroughs.

npm install mursa-guide

Key Features

Step-by-Step Tours

Create guided tours with multiple steps that highlight different parts of your UI.

Smart Positioning

Tooltips automatically position themselves to stay visible on screen.

Customizable Themes

Built-in light and dark themes with full CSS customization support.

How to Use Mursa Guide

  1. 1
    Install the package

    Run npm install mursa-guide to add the library to your React project.

  2. 2
    Define your tour steps

    Create an array of steps with target selectors, titles, and content. Each step points to a DOM element you want to highlight.

  3. 3
    Start the tour

    Use the provided hook or component to trigger the tour when users first visit, click a help button, or complete an action.

Why Use Mursa Guide?

Improve User Onboarding

Help new users understand your app faster with interactive guided tours that highlight key features.

Lightweight Bundle

Minimal bundle size with no external dependencies. Keeps your app fast and responsive.

Flexible Configuration

Control every aspect of your tours including positioning, animations, callbacks, and conditional steps.

Accessibility Built-In

Keyboard navigation and screen reader support for inclusive user experiences.

Frequently Asked Questions

What is Mursa Guide?
Mursa Guide is an open-source React library for creating interactive product tours and onboarding experiences. It helps you guide users through your application with step-by-step tooltips and highlights.
How do I create a product tour with Mursa Guide?
After installing the package, define your tour steps as an array with target selectors and content. Wrap your app with the MursaGuide provider and trigger the tour when needed. Each step can include custom content, positioning, and navigation options.
Can I customize the appearance of Mursa Guide?
Yes, Mursa Guide is fully customizable. You can style tooltips, change animations, customize navigation buttons, and apply your own CSS classes. The library supports both light and dark themes out of the box.

More Libraries

Need a tool? Ask us!