Skip to content
Toolradar
Shepherd.js logo

Shepherd.js

Claim this tool

Guide users through your application with interactive, step-by-step tours.

Free plan available, paid tiers above
FreemiumDeveloper ToolsUI/UX Design
Visit Website
Tracked since2026

The Bottom Line

Price
Free plan available, paid tiers above. Compare plans

Key facts

  • Create interactive guided tours for web applications.
  • Highly customizable step options and tour flow.
  • Free for open-source, personal, and non-commercial use.

Pros

  • Open-source and free for non-commercial projects
  • Extensive customization options for tour appearance and behavior
  • Easy to integrate with existing web applications
  • Supports smooth scrolling to highlighted elements
  • Provides clear navigation controls within tours

Cons

  • Commercial use requires a paid license
  • Requires JavaScript knowledge for implementation

What is Shepherd.js?

Shepherd.js is an open-source JavaScript library designed to create guided tours for web applications. It enables developers to highlight specific elements on a page and provide contextual information, helping users understand new features, navigate complex interfaces, or onboard effectively. The library offers flexible customization options for step content, appearance, and behavior, ensuring tours seamlessly integrate with any application's design and user experience. Shepherd.js is ideal for developers, product managers, and UX designers looking to improve user onboarding, feature adoption, and overall user engagement within their web products. It provides a robust and customizable solution for creating interactive guides without extensive development effort, supporting both simple walkthroughs and complex multi-step journeys.

Available on: Web

how we evaluateSourceshepherdjs.dev ↗

Key Features

  • Customizable default step options
  • Configurable cancel icon for tour steps
  • Custom CSS classes for tour steps
  • Scroll-to behavior for tour steps
  • Attach tour steps to specific DOM elements
  • Customizable action buttons for navigation
  • Programmatic tour start and navigation

Pricing Plans

Pricing checked Sep 30, 2026

Shepherd.js plans and prices, checked September 2026
PlanPriceDetails
Free plan

Free

  • Free for open-source, personal and non-commercial sites
Business Plan

$50 / lifetime

  • Up to 5 projects
  • 1 month commercial support
  • Regular product updates
+1 more
  • Lifetime license
Enterprise Plan

$300 / lifetime

  • Unlimited projects
  • 6 months support
  • Prioritized Github Issues
+1 more
  • Lifetime license
Shepherd Consulting

Contact us

  • White-Glove Services
  • On-Boarding & Training
  • Advanced analytics
+1 more
  • Support via Professional Services
Calculate your costView full pricing

Is Shepherd.js worth the price?

Great value

Shepherd.js offers a very generous pricing model, especially with its lifetime licenses.

The Free plan for open-source and personal use is excellent, and the Business Plan at $50 lifetime for 5 projects is highly affordable. The Enterprise Plan at $300 lifetime for unlimited projects is also a strong value proposition for larger needs, making it ideal for developers and small to medium businesses looking for a one-time purchase.

Full Shepherd.js pricing: every plan, hidden costs and alternatives

Reviews

Improve Your Thinking Patterns Using ChatGPT cover
$99Free with your review

Review Shepherd.js, get a free AI guide

Share your experience and we will send you Improve Your Thinking Patterns Using ChatGPT, free.

Write a review

Best Shepherd.js Alternatives

Top alternatives based on features, pricing, and user needs.

View full list →
Sketch logo
SketchPaid

Mac UI/UX design with real-time collaboration

4.3
Framer logo
FramerFreemium

Design, publish, and launch production websites with AI

4.4
UXPin logo
UXPinFreemium

Design with code components, ship production-ready prototypes

4.2
FlutterFlow logo
FlutterFlowFreemium

Visual app builder for Flutter applications

4.4
v0 logo
v0Freemium

AI-powered UI generation from Vercel

4.1
Pixso logo
PixsoFreemium

All-in-one online UI/UX design, prototyping, and collaboration tool with real-time synchronization.

4.7
See all developer tools →

Still deciding?

Most buyers shortlist 2 or 3 tools before committing. Pull a side-by-side comparison or browse the full alternatives shortlist below.

All Shepherd.js alternatives6+ tools ranked, pricing + verdict per pickShepherd.js vs SketchHead-to-head: features, pricing, who winsShepherd.js vs FramerHead-to-head: features, pricing, who winsShepherd.js vs UXPinHead-to-head: features, pricing, who wins

Explore More

Best Developer ToolsBest UI/UX Design ToolsBest Free Developer ToolsBest Free UI/UX Design

Shepherd.js FAQ

How does Shepherd.js help with user onboarding?

Shepherd.js enables developers to create interactive, step-by-step tours that guide new users through an application. These tours can highlight specific elements and provide contextual information, helping users understand features and navigate interfaces effectively during onboarding.

What kind of user benefits most from Shepherd.js?

Shepherd.js is ideal for developers, product managers, and UX designers who aim to improve user onboarding, feature adoption, and overall user engagement within their web products. It provides a customizable solution for creating interactive guides.

How does Shepherd.js compare to a tool like Framer?

Shepherd.js focuses specifically on creating guided tours and interactive walkthroughs within web applications, offering extensive customization for step content and appearance. Framer, by contrast, is a broader design and prototyping tool that allows for creating interactive user interfaces.

What are the primary limitations of using Shepherd.js?

A primary limitation of Shepherd.js is that commercial use requires a paid license, distinguishing it from its free non-commercial offering. Additionally, implementing Shepherd.js effectively requires a foundational understanding of JavaScript.

How is Shepherd.js priced?

Shepherd.js is available on a free tier for non-commercial projects. For commercial usage and access to more features, paid plans are offered.

Can Shepherd.js tours be customized to match an application's design?

Yes, Shepherd.js offers extensive customization options for the appearance and behavior of its tours. This ensures that the step content and overall look seamlessly integrate with any application's existing design and user experience.

Does Shepherd.js support navigation within tours?

Shepherd.js provides clear navigation controls built into its tours, allowing users to move through steps easily. It also supports smooth scrolling to highlighted elements, enhancing the user's experience during a guided tour.

Source: shepherdjs.dev

Guides & Articles

Best Prompt Management & PromptOps Tools 2026

Expert guide

Best Headless CMS Platforms in 2026

Expert guide

Best LLM Observability Tools in 2026

Expert guide