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

Text Color

Background Color

Height: 30px

Border Radius: 6px

Border Color

Opacity: 0.8

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>
Browser Support
Firefox

Firefox 4.0+

Safari

Safari 5.0+

Opera

Opera 6.0+

Chrome

Chrome 4.1+

Internet Explorer

IE 9.0+

Tooltips Preview
CSS Code