Tooltip vs Popover
Two ways to show a small floating layer
I need a small layer floating out from something. Which one?
Comparison table
| Pattern | Trigger | What fits inside | Clickable | Typical use |
|---|---|---|---|---|
| Tooltip文字提示 | Hover / focus | Text only | No | Explaining icons and abbreviations |
| Popover浮出层 | Click | Menus, forms, anything | Yes | Action panels, pickers |
← Swipe to see the full table
The demos, side by side
Tooltip
文字提示How to decide: "What does this thing do?"
Popover
浮出层How to decide: "Pick one of these or fill this in"
Decision rule
- you just need to explain a name or an abbreviationuse a Tooltip
- the layer needs to be tappable, selectable, or fillableuse a Popover
- mobile is a primary platformdo not lean on Tooltips (hard to trigger on touch) — use visible text
One line separates them: a Tooltip can only be read, a Popover can be used. If anything clickable shows up inside your floating layer, it is not a Tooltip.