Tooltip

A tooltip component is a graphical user interface element that provides additional information or context about a particular element on a web page or application when the user hovers an element.

Use cases:

✅ When you want to provide additional information or context about an element on the page, such as the purpose of a button or the meaning of an icon.

✅ When you want to guide users on how to use a particular feature or provide instructions on how to perform a task.

✅ When you want to clarify a term or concept that may be unfamiliar to some users.

Not to use cases

❌ When the information provided in the tooltip is critical for the user to understand the functionality or purpose of an element, as tooltips can easily be missed or ignored.

❌ When the tooltip is too long or detailed, as it may overwhelm the user with too much information at once.

❌ When the tooltip overlaps with other elements on the page, making it difficult to read or interact with.