pattern-library 2 linked patterns checked
Fluent 2 Popover
Describes popovers as small brief contextual surfaces, cautions against essential task content and nesting, and covers layout, sizing, positioning, and accessibility considerations.
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 |
|---|---|---|---|
| Modal for nonblocking content | Flag this anti-pattern when content can be read later, ignored safely, dismissed without consequence, or shown near its object without blocking the rest of the page. | Users can continue the primary task while reading or ignoring nonblocking information. | Supports popovers for brief contextual nonessential content. |
| Popover | Choose popover when a local trigger needs a compact contextual layer with short copy, a few actions, or light controls that belong to that exact anchor. | The trigger name and visible placement make clear which object or field the popover belongs to. | Supports brief nonessential contextual content, positioning, sizing, and nesting cautions. |
Comparisons supported by this source
- Modal for nonblocking content vs modal dialog vs popover vs drawer vs inline message
Supports popovers as brief contextual surfaces for small nonessential contextual content.
- Popover vs menu button vs modal dialog vs sheet
Fluent supports keeping popover content brief, contextual, and nonessential.
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: .