• Home
  • CSS Tooltip Generator

CSS Tooltip Generator

This generator will help you design and learn how to make CSS tooltips. By using this generator it will save you time and effort in creating that perfect CSS tooltip for your website. Tooltips are a great way to display information about a link before to user proceeds to the destination.
Please note that this generator will not work in all browsers, currently only web browsers that support CSS3 will render the tooltip correctly.

Tooltip Options
Container Color

  • Tooltip Container

    Text Color

    Background Color

    Height: 30px

    Border Radius: 6px

    Border Color

    Opacity: 0.8

  • Tooltip Position

  • CSS3 Extras

    Box Shadow

    Shadow Color

    Horizontal Length: 0px

    Vertical Length: 0px

    Blur Radius: 0px


    Text Shadow

    Shadow Color

    Horizontal Length: 0px

    Vertical Length: 0px

    Blur: 0px

HTML Code
<a class="tooltips" href="#">CSS Tooltips
<span>Tooltip</span></a>
Tooltips Preview
CSS Code