pattern-library 2 linked patterns checked
Fluent 2 Tooltip
Documents tooltip placement near targets, optional arrows, aria-describedby association, essential-content limits, concise wording, and disabled-control explanation guidance.
Read with a purpose
What this source can teach
Use this source to compare a documented solution with the task and states in your own product.
- Start with the original. Open the source and find the guidance or example relevant to your task.
- Trace the connection. Use the claim notes below to see how this site applies the source to specific patterns.
- Check the setting. Compare the source's platform, people, and constraints with your own decision.
Pattern Decisions This Source Supports
| Pattern | Supported decision | Required contract | Claim note |
|---|---|---|---|
| Tooltip | Choose tooltip when the target already has a usable name and needs only a short supplemental description on focus or hover. | The owning element keeps focus while the tooltip is visible. | Supports concise supplemental content, placement, arrows, and target association. |
| Tooltip-only required information | Flag this anti-pattern when the tooltip content is necessary to complete the task correctly or avoid a harmful outcome. | Users can complete the task without reading a tooltip. | Supports concise associated tooltip content and the essential-content boundary. |
Comparisons supported by this source
- Tooltip vs popover vs inline message vs icon-only ambiguous action
Fluent supports concise supplemental content, placement, arrows, and disabled-control explanation guidance.
- Tooltip-only required information vs tooltip vs inline message vs disclosure details vs popover
Supports concise associated tooltip content and warns against using tooltip treatment for essential content.
Evidence Role
This source is treated as pattern-library evidence. Its value comes from the specific claims and setting described above.
Publisher: Microsoft Fluent 2 Design System. Last checked: .