Skip to content

Driver.js

A small, dependency-free JavaScript library for highlighting page elements and building product tours.

Stars
27k
Forks
1.2k
Licence
MIT
Language
TypeScript
Last update
8 days ago
Type
Library

What it is

Driver.js is a JavaScript library that dims the page and spotlights specific elements with a popover, so you can guide a visitor's attention. Its README says it is used for product tours, feature introductions, contextual help, and simple modals. It is written in TypeScript, has no external dependencies, and is described as about 5kb gzipped.

  • Show a step-by-step tour when a new user first signs in
  • Highlight a newly released feature with a short popover
  • Dim the background and show help text while a user fills out a form
  • Use the hooks to act when an element is about to be highlighted or deselected

Great for

  • Web developers adding a product tour or onboarding flow to an existing web app
  • Teams introducing new features to users inside a site
  • Developers who want to highlight a form field or component with contextual help
  • Projects that want a light library instead of a heavier tour framework

Not ideal for

  • People without any web development experience, since it is set up through code and its API
  • Sites that need a no-code tour builder, because the README describes only a code library
  • Projects that must support browsers outside the README's general claim of 'all major browsers', since exact browser versions are not listed in the README excerpt
Step-by-step guide: how to use Driver.jsInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js (version not stated in the README excerpt) · pnpm (used in the README's local development commands)

    Clone the repository

    git clone https://github.com/nilbuild/driver.js

    Install dependencies (for local development)

    pnpm install

    Install playground dependencies

    pnpm run playground:install

    Start the playground

    pnpm dev
  2. 2

    Run it

    • Clone the repository and run pnpm install
    • Run pnpm run playground:install to set up the example app
    • Run pnpm dev to open the Astro playground with live examples
    • Edit a file under playground/src/examples/ and check the change in the browser
  3. 3

    Get the most out of it

    • Use the playground to test changes against live examples before using them in your site
    • Add your own example by adding an entry to highlight.ts, popover.ts, tour.ts, or api.ts
    • Use the hooks described in the README to change elements as they are highlighted or deselected
    • Use the documentation at driverjs.com for demos and the full API

Downloads

Strengths

  • The README says it has no external dependencies and is light-weight
  • Keyboard-controllable, according to the README
  • MIT licensed, so it is free for personal and commercial use

Trade-offs

  • The README excerpt does not give setup code or full API details; the docs are on the linked website
  • Its size and browser support claims come from the README itself and were not independently checked

How it compares

ProjectStarsTypeLevelUpdatedBest for
driver.js (this)27kLibraryintermediate8 days agoWeb developers adding a product tour or onboarding flow to an existing web app
floating-ui32.8kLibraryintermediate10 days agoWeb developers building tooltips, popovers, or dropdown menus
tippyjs12.2kLibraryintermediate2.4 years agoWeb developers who want ready-made tooltips or dropdown menus without building them from scratch

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.