Browse all terms / Interaction
Interaction
General term

Popover

Display a small contextual panel beside its trigger.

Live preview Try the effect

Live preview

Try the controls to understand this pattern.

This demo explains the pattern. Adapt the styling and dimensions to your project.

What it is

Display a small contextual panel beside its trigger. This example illustrates an admin interface. Describe the target, trigger and final state when adapting it to your project.

When to use

Compact settings, actions and related details.

Related concepts

A popover may contain controls; a tooltip provides a short, noninteractive explanation.

Describe this effect

Open a small popover anchored to the trigger, with accessible controls and a clear way to dismiss it.

Generated from the parameters · Add to a plan to edit

References

Specification and implementation reference

Definitions are editorial. Common and descriptive names are not necessarily standardized terms.

Preparing both languages offline…

Favorites and plans are saved on this device