A tooltip is small pop-up text that is displayed when a user positions the cursor over HTML elements. Tooltips are useful to show some additional information. Input fields in web forms are a perfect example of such a situation. So in this post we`ve gathered 20 awesome libraries for implementing great looking tooltips using CSS and Javascript.
Floating Ui
A low-level toolkit to create floating elements. Tooltips, popovers, dropdowns, and more.
Tooltip Sequence
A simple step by step tooltip helper for any site.
Annotator Pro
Easy image annotations, tooltips and zooming.
Popper.js
It is a positioning engine, its purpose is to calculate the position of an element to make it possible to position it near a given reference element.
Tether
It is a JavaScript library for efficiently making an absolutely positioned element stay next to another element on the page. For example, you might want a tooltip or dialog to open, and remain, next to the relevant item on the page.
Hint.css
It is written as a pure CSS resource using which you can create cool accessible tooltips for your web app.
Tippy.js
It is a highly customizable vanilla JS tooltip and popover library powered by Popper.js.
jBox
It is a jQuery plugin that makes it easy to create customizable tooltips, modal windows, image galleries and more
React Popper
React wrapper around Popper.js.
html5tooltips.js
Tooltips, written in pure JavaScript, with smooth 3D animation implemented in CSS. No framework required.
PowerTip
It 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.
grumble.js
A grumble can be rotated around a given element at any angle, all 360 degrees. Any distance can be specified. Any CSS style can be applied. There’s auto-magic size adjustment for use with localised text. FX queues for animating multiple grumbles. And it works in IE6+, and modern browsers.
Microtip
A modern, elegant and minimal, css only tooltip library.
v-tooltip
Easy tooltips, popovers and dropdown with Popper.js.
Wenk
It is a Lightweight tooltip available in pure CSS, cssnext using PostCSS, Less or SCSS.
Tootik
A pure CSS/SCSS/LESS Tooltip library. Super easy to use, No JavaScript required.
d3.tip
This javascript library provides tooltips for d3.js visualizations such as bar charts. The tooltips show value at the selection and label for the unit. They can be styled, shown, hidden, positioned and updated.
Reactjs-Popup
It is a simple react popup component with a lot of benefits.
jsPanel
A JavaScript library to create highly configurable floating panels, modals, tooltips, hints/notifiers/alerts or contextmenus for use in backend solutions and other web applications.
Tlite
This is a JavaScript tooltip library with 0 dependencies that aims to be as small as possible without skimping on key features. It currently weighs in at less than 650 bytes when minified and gzipped.
Zebra
It is a lightweight jQuery tooltips plugin for creating simple but smart and visually attractive tooltips, featuring nice transitions, 4 themes, and offering a wide range of configuration options.
Pure JS MouseTip
A pure javascript solution for creating tooltips that follow your mouse.