Popover

Also called pop-up, flyout, disclosure panel, inline panel

A layer anchored to a trigger, opened deliberately by click, that can contain interactive content.

Example

Columns shown: 2

TaskStatusAssignee

Fix login redirect——

Update pricing page——

Everything inside is focusable and the table stays visible while you change it — the two things a tooltip cannot offer.

A handful of controls belong to one specific element — a colour picker, a date picker, a set of filters for one column.
Extra detail with an action attached: a definition plus a link, a summary plus a button.
The content is genuinely optional and the user should be able to open it when they want it, not have it pushed at them.
The panel needs to stay visually tied to its trigger, so a modal in the middle of the screen would break the connection.

It is plain text with nothing to click. That is a tooltip, and a popover makes the user work for it.
There is a lot of content or it needs scrolling. Use a drawer, or a page.
The decision is blocking or destructive — a popover is too easy to dismiss by clicking away.
You want it to open on hover. Hover-opened panels with buttons inside are a well-known trap: the pointer has to cross a gap to reach them and they vanish on the way.
It would open from inside another popover. Anchored layers stacked on anchored layers lose their anchor.

Keeps context: the panel points at the thing it belongs to.
Holds real controls, unlike a tooltip.
Dismissing is cheap — click outside or press Escape — which suits optional content.

Cheap dismissal cuts both ways: half-finished input can be lost with a stray click.
Positioning near viewport edges is fiddly and needs a real positioning engine.
On narrow screens it often ends up nearly full width, at which point a bottom sheet is the better shape.

What this pattern needs in order to work for everyone.

Keyboard: Opens with Enter or Space on the trigger, not on hover.
Escape closes it and returns focus to the trigger.
Tab moves through the content inside. Whether it wraps or falls through to the page is your choice — but be consistent, and never leave focus stranded.
Roles and state: Give the trigger `aria-expanded` so its state is announced, and `aria-controls` pointing at the panel.
Use `role="dialog"` only if the popover is modal — with a focus trap and an inert background. Most popovers are not, and claiming otherwise misleads assistive tech.
Label the panel with `aria-labelledby` when it has a heading.
Focus: Focus moves into the panel on open and returns to the trigger on close. That single behaviour is what makes a popover usable where a tooltip is not — and why anything clickable belongs here rather than there.

Linear — Assignee and label pickers open as popovers anchored to the field they change.
Notion — The formatting menu is a popover tied to the selection, keeping the text in view while you work on it.

Side-by-side breakdowns of patterns that solve a similar problem.