Component Documentation
Open popover
Component slot – add any component
Open popover
Component slot – add any component

Popover

The Popover component displays extra content in a floating panel that appears when a trigger is clicked. It’s great for showing tooltips, quick actions, or additional context without navigating away from the page.

It consists of two parts:

  • Trigger Slot – the element that opens the popover (we’ve added a button by default)
  • Popover Slot – the floating panel where you can place any content you like

Usage

  1. Drag the Popover component onto the canvas.
  2. Edit the trigger (e.g. change the button or swap it with another element).
  3. Drop your content into the popover slot — text, buttons, images, or anything else.
  4. Customize styling and positioning as needed.

This component is perfect for building lightweight overlays that keep users in context while offering additional interaction.

GSAP powered interaction

This popover uses Webflow’s new GSAP-powered Interactions. When the .popover_trigger is clicked, the .popover_content animates in. Clicking the trigger again hides it with the same smooth effect.