Skip to content
All effectsOverlays

Anchor Pop

It scales out of the arrow, not out of its own centre. One transform-origin placed on the anchor point does the whole job, and it stays correct when the popover flips side.

Pure CSSOverlaysPro

Usage

Meant for

PopoverDropdown MenuHover Card

Examples

On a Popover

The popover grows out of its own anchor rather than out of its middle: --wm-origin is the point above the panel where the arrow sits. Set it to the anchor's side and the same class covers a menu opening upward.

NotificationsChoose what reaches your inbox.

The class is wm wm-anchor-pop — the first half is the marker the trigger and reduced-motion rules hook into, the second is the effect.