Tooltip is shiny little “bubble” that will popup when user hover over image, text, button or any HTML elements. That’s extremely useful to provide descriptive help to the user. So here are some resources for creating modern and intuitive tooltip.

HTML5tooltips.js

Light and clean tooltips written in pure JavaScript with CSS3 animation and no framework dependencies.

Hint.css

Hint.css is a tooltip library written in SASS which uses only HTML/CSS to create simple tooltips. It does not rely on any JavaScript and rather uses data-* attribute, pseudo elements, content property and CSS3 transitions to create the tooltips.

Tooltipster

A powerful, flexible jQuery plugin enabling you to easily create semantic, modern tooltips enhanced with the power of CSS.

Opentip

opentip is a javascript tooltip framework yes – it’s free, open source and comes with different styles!

Tipso

A Lightweight Responsive jQuery Tooltip Plugin.

Tooltip Styles Inspiration

A small collection of various hover tooltip styles and effects for your inspiration. Using CSS transforms, border-radius and SVG shapes we can create modern looking and interesting tooltips.

Points Of Interest

Use this resource to highlight the points of interest of your products. Just a click to open a brief description of each point, allowing your user to get a deep and fast understanding of your product features.

PowerTip

PowerTip features a very flexible design that is easy to customize, gives you a number of different ways to use the tooltips, has APIs for developers, and supports adding complex data to tooltips. It is being actively developed and maintained, and provides a very fluid user experience.

qtip2

qTip2 is the second generation of the advanced qTip plugin for the ever popular jQuery framework.

jBox

jBox is a powerful and flexible jQuery plugin, taking care of all your popup windows, tooltips, notices and more.