MARKETPLACE
PLUGINS
ADVANCED TOOLTIPS FOR ANY ELEMENT
Advanced Tooltips For Any Element logo

Advanced Tooltips For Any Element

Published June 2021
   •    Updated December 2025

Plugin details

Customizable Tooltips Elevate your application's user experience with our highly customizable tooltips plugin. Designed for ease of use and maximum flexibility, this plugin allows you to create stunning tooltips for any element in your application.

Key Features
  • Easy Customization: Effortlessly tailor your tooltips to match your application's style and branding.
  • Text Customization: Personalize the content of your tooltips with ease.
  • Positioning Options: Place your tooltips exactly where you need them—above, below, left, or right of your elements.
  • Adjustable Length: Control the length of your tooltips to ensure they fit perfectly within your design.
  • Background Color: Choose from a wide range of background colors to make your tooltips stand out or blend seamlessly with your interface.
  • Text Color: Ensure readability and visual appeal by customizing the text color.
  • Border Radius: Add a touch of elegance with adjustable border radii, from sharp corners to smooth, rounded edges.
  • Text Size: Adapt the size of the tooltip text to ensure clarity and emphasis.

With our plugin, you can transform simple tooltips into dynamic, visually appealing elements that enhance user interaction and provide valuable information seamlessly. Whether you're looking to highlight key features, offer additional context, or guide users through your application, our customizable tooltips are the perfect solution.

Start creating beautiful, functional tooltips today and make your application more intuitive and user-friendly with our Customizable Tooltips Plugin.

🧑🏻‍💻 Demo: https://segongora-testing.bubbleapps.io/version-test/tooltip
🔗 Editor: https://bubble.io/page?id=segongora-testing&version=test&name=tooltip&tab=Design

$12

One time  •  Or  $5/mo

3.1 stars   •   7 ratings
239 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

Datamatic Software logo
Datamatic Software
Joined 2022   •   36 Plugins
View contributor profile

Instructions

The Tooltip element offers the following customizable properties:
  • Element ID: The defined ID of a Bubble element. To be able to add an ID to the element you will first need to expose the option in Settings -> General -> General Appearance.
Please notice, even though in the Demo all elements have the same ID, this is a really bad practice as explained by Mozilla: "The id global attribute defines an identifier (ID) which must be unique in the whole document."
  • Allow HTML: Determines if content strings are parsed as HTML instead of text.
  • Contet: The content of the tooltip.
  • Placement: Positions the tooltip relative to its reference element.
  • Trigger: The events (each separated by a space) which cause a tooltip to show.
  • Animation: The type of transition animation.
  • Arrow: Determines if the tooltip has an arrow.
  • Delay: Delay in ms once a trigger event is fired before a tippy shows or hides.
  • Follow Cursor: Determines if the tooltip follows the user's mouse cursor.
  • Background Color: Determines the tooltip background color.
  • Text Color: Color of the text inside the tooltip.
  • Hide On Click: Determines if the tippy should hide if a mousedown event was fired outside of it (i.e. clicking on the reference element or the body of the page).
  • Interactive: Determines if the tippy is interactive, i.e. it can be hovered over or clicked without hiding.



This are step-by-step instructions on how to get the plugin working on any Bubble App.

1. Add this plugin to your application.
2. Add the element 'Tooltip' into your Editor
3. Set the ID of the element you want to have a tooltip on
4. Customize the properties in the element you want for your Tooltip, and include the same Element ID

🧑🏻‍💻 Demo: https://plugins.datamaticsoftware.com/tooltip
🔗 Editor: https://bubble.io/page?version=live&type=page&name=tooltip&id=segongora-testing&tab=tabs-1&subtab=Plan

Types

This plugin can be found under the following types:
Background Services   •   Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:
Productivity   •   Technical   •   Containers   •   Media   •   Visual Elements

Resources

Support contact
Documentation
Tutorial

Rating and reviews

Average rating (3.1)

Doesnt work in repeating groups
June 5th, 2024
Z-index is all wacky in repeating groups and ends up getting covered by other elements.
Hi, sorry to hear you're having problems. Could you please reach out to [email protected] and we will help you debug and resolve? Thank you
June 5th, 2024
  •  
Datamatic Software
Fantastic Plugin!!
November 24th, 2023
Great and versatile plugin. Definitely better than most. Devs reply really fast and they help you with anything
Works with workflow actions rather than an element so impossible to use at scale
July 13th, 2023
Works with workflow actions rather than an element so impossible to use at scale
Hello, the element has now been added to the plugin!!
September 11th, 2023
  •  
Datamatic Software
Oh ! Let me give it a new try!
September 11th, 2023
  •  
Original reviewer
Amazing plugin!
June 7th, 2023
Love the highly customization of the tooltip!
Works using workflows only, not ideal
March 31st, 2023
Hello, an element has now been added to the plugin!!
September 11th, 2023
  •  
Datamatic Software
Bubble