Tooltip

Provide additional context on hover or focus

What it solves

A tooltip is a small popup that provides additional contextual information when a user hovers over, focuses on, or interacts with an element. It helps clarify elements with icons, buttons, or text snippets that may not be self-explanatory. There are two types of tooltips:

• Simple Tooltips – Short text descriptions that appear on hover or focus, providing a brief explanation.
• Rich Tooltips – Enhanced tooltips that may contain formatted text, icons, images, or interactive elements. Tooltips should be used to enhance understanding without overwhelming the user interface.

When to use