Tooltip
An overlay for small amounts of data.
Overview
Tooltips add additional context to a button or other UI element.
Guidelines
Tooltips can only contain a short volume of text.
Do not communicate critical information in a tooltip; think of it as a "Did you know?" prop.
When to use
When you need to display additional content to give more context to users.
When not to use
For long-text overlays. Use popover instead.
As a bandaid on a broken experience.
Content
Tooltip content should follow our content guidelines. Keep them clear and useful.
Last updated