Transform any image or video into an interactive showcase with clickable hotspots revealing product details, pricing, and purchase options: perfect for e-commerce and product tours.
Create engaging product experiences with the interactive hotspot component. Transform static images or dynamic videos into interactive showcases where viewers can click or hover over specific areas to reveal detailed product information, pricing, and purchase options. Each hotspot pulses with customizable animations to draw attention and guide user interaction through a smooth, professional experience.
The component intelligently positions information cards near hotspots while automatically avoiding screen edges and overlaps, ensuring information is always readable and accessible. Each hotspot can also override the automatic placement with a manually set position - left, right, top, or bottom - giving you full control over the layout. With built-in support for both image and video backgrounds, product thumbnails, pricing displays, and call-to-action buttons, you can create complete shopping experiences without leaving the media. Whether you're showcasing products on an eCommerce store, presenting fashion lookbooks, tech product features, video demonstrations, or interior design walkthroughs, this component delivers an intuitive and visually stunning user experience.
Dual media support with image or video backgrounds for versatile presentations
Fully customizable colors & typography
Interactive hotspots with pulsing beacon animations for visual attention
Adjustable pulse animations with size, intensity, and speed controls
Intelligent card positioning that automatically adapts to available space
Per-hotspot card position override with left, right, top, and bottom options
Customizable hotspot appearance with circle or square shapes
Multiple center icon options including plus, dot, ring, cross, or custom icons
Transform any image or video into an interactive showcase with clickable hotspots revealing product details, pricing, and purchase options: perfect for e-commerce and product tours.
Create engaging product experiences with the interactive hotspot component. Transform static images or dynamic videos into interactive showcases where viewers can click or hover over specific areas to reveal detailed product information, pricing, and purchase options. Each hotspot pulses with customizable animations to draw attention and guide user interaction through a smooth, professional experience.
The component intelligently positions information cards near hotspots while automatically avoiding screen edges and overlaps, ensuring information is always readable and accessible. Each hotspot can also override the automatic placement with a manually set position - left, right, top, or bottom - giving you full control over the layout. With built-in support for both image and video backgrounds, product thumbnails, pricing displays, and call-to-action buttons, you can create complete shopping experiences without leaving the media. Whether you're showcasing products on an eCommerce store, presenting fashion lookbooks, tech product features, video demonstrations, or interior design walkthroughs, this component delivers an intuitive and visually stunning user experience.
Dual media support with image or video backgrounds for versatile presentations
Fully customizable colors & typography
Interactive hotspots with pulsing beacon animations for visual attention
Adjustable pulse animations with size, intensity, and speed controls
Intelligent card positioning that automatically adapts to available space
Per-hotspot card position override with left, right, top, and bottom options
Customizable hotspot appearance with circle or square shapes
Multiple center icon options including plus, dot, ring, cross, or custom icons
