Intro.js documentationHomepageHomepageQuick StartQuick StartSupportSupportBlogBlog
GitHubGitHub (opens in a new tab)
  • Introduction
    • Install Intro.js
    • Quick Start
    • License
      • Async/Await callbacks
      • Confirm before exit
      • CSS ClassName
      • Disable element interaction
      • Don't Show Again
      • Floating tooltip
      • HTML in tooltip
      • JSON configuration
      • Progress bar
      • Right-to-left tour
      • Scrollable element
      • Tooltip positions
      • Tour for SVG elements
      • Tour Hello World
      • Tour without bullets
      • Tour without buttons
    • Tour API
    • Tour HTML Attributes
    • Tour Options
      • Hints Hello World
    • Hints API
    • Hints HTML Attributes
    • Hints Options
    • Install themes
    • Intro.js Themes
    • Add your Intro.js wrapper
    • Intro.js Angular
    • Intro.js Dart
    • Intro.js Drupal
    • Intro.js Ember
    • Intro.js GWT
    • Intro.js Magento
    • Intro.js R
    • Intro.js Rails
    • Intro.js React
    • Intro.js Wordpress
    • Intro.js Yii
    • Intro.js Yii2
    • Build Intro.js
    • Intro.js Changelog
  • More
  • Community
  • Support
Question? Give us feedback → (opens in a new tab)
Docs
Tour
Examples
CSS ClassName

CSS ClassName

You can customize your product tour using the tooltipClass option:

.customTooltip * {
  color: #4a4a4a;
  font-size: 18px
}
 
.customTooltip .introjs-tooltip-title {
  color: #0a41c9;
}
introJs().setOptions({
  tooltipClass: 'customTooltip'
}).start()
Image alt text

Quaco Lighthouse

The Quaco Head Lighthouse is a well maintained lighthouse close to St. Martins. It is a short, beautiful walk to the lighthouse along the seashore.
Confirm before exitDisable element interaction

2024 © Intro.js.