PromoBubble adds a small floating promotional CTA to your Framer site. Visitors see a compact pill-style bubble such as “New,” “Sale,” or “Try it,” then hover or click to reveal a branded promo card with a title, description, close button, and CTA link. It is ideal for highlighting a product launch, template, feature, discount, signup offer, or marketplace component without taking over the page.
Floating pill bubble with editable label, position, trigger behavior, font, colors, and radius. Choose from four screen positions: bottom-right, bottom-left, top-right, and top-left. Open the promo card on hover for desktop interactions or on click for more deliberate behavior. Touch and pen devices automatically use tap-to-toggle when hover is unreliable. Promo card includes editable title, description, CTA label, CTA URL, and optional close icon. The card animates with opacity, scale, and directional movement based on its screen position. Includes outside-click closing, Escape key closing, focus restoration, and ARIA attributes for dialog-style accessibility. CTA links are sanitized to allow safe http, https, mailto, tel, relative, and anchor links. External links open in a new tab with proper noopener noreferrer. Motion respects static rendering and reduced-motion preferences.
Add PromoBubble to your Framer canvas and set the floating position from the property panel. Enter the bubble label, promo title, description, CTA label, and CTA link. Choose whether the card opens on hover or click. Customize the background color, accent color, text color, font, corner radius, and close icon visibility. Use it for small announcements, product links, offer prompts, or creator-store promotion without adding a large modal or banner.
Product launches, sale announcements, template promotions, creator store links, new feature callouts, waitlist prompts, newsletter CTAs, support links, affiliate offers, SaaS upgrade nudges, portfolio project highlights, and any Framer site that needs a subtle floating promotional action.
Spyridon Merkouris
