Tooltips are a short message which appears when a cursor is positioned over an icon, link, image or any other HTML element of GUI. In this collection, we showcase the best free HTML and CSS tooltips which you can easily integrate with your website.
|Demo Image: Tooltiper|
Friendly little tooltips with animation.
Made by Joshua Ward on March 04, 2017demo and code
Pure CSS Tooltips
|Demo Image: Pure CSS Tooltips|
Made by John Fink on November 29, 2016demo and code
Info Button Like Tooltip
|Demo Image: Info Button Like Tooltip|
CSS only info tooltip using focus state to toggle visibility of the button.
Made by Mark Thomes on January 10, 2017demo and code
Tooltip with CSS animations
|Demo Image: Tooltip with CSS animations|
A simple tooltip popup with a drop-shadow filter.
Made by James Mejia on June 16, 2015demo and code
Tooltiper by data attribute
|Demo Image: Tooltiper by data attribute|
This is a tooltiper. It works with data attribute. Just wrap your element in any html element with tooltiper class and add your content inside a data-tooltip attribute.
Made by Thomas Podgrodzki on October 23, 2017demo and code
|Demo Image: Adaptive Tooltips|
Made by Vladimir on February 13, 2019demo and code
Fancy And Animated Tooltip (CSS Only)
|Demo Image: Fancy & Animated Tooltip (CSS Only)|
Made by R. Schnetzinger on January 07, 2019demo and code
Pure css tooltip with full shadow around
|Demo Image: Pure css tooltip with full shadow around|
Made by Vitalii on December 22, 2017demo and code
|Demo Image: Tooltip|
Made by hixann on August 30, 2017demo and code
CSS ToolTip Smooth animation
|Demo Image: CSS ToolTip Smooth animation|
Made by Omar Dsoky on June 14, 2017demo and code