---
title: "Image Hotspots — Framer component · Best of Framer"
description: "$12.00 · Framer component · by Feux Design · Backgrounds. Add interactive hotspots to any image"
canonical: "https://framer.elliotli.dev/component/image-hotspots"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Image Hotspots

# Image Hotspots

Add interactive hotspots to any image

[View on Framer](https://framer.com/marketplace/components/image-hotspots/?via=elliot-li)

![Image Hotspots preview image 1](https://framer.elliotli.dev/og/component/image-hotspots/eba30c7c5a51f720/1600x1200.jpg)

## Summary

Add interactive hotspots to any image

## Description

Turn any image into an interactive experience with hotspots. The Image Spots component lets you place numbered markers anywhere on an image, each revealing a styled info box with smooth animations.

**Flexible Spot Placement**

Position up to 20 spots anywhere on your image using percentage-based coordinates. Each spot supports its own title, description, and info box placement direction, top, right, bottom, or left.

**Click or Hover Interaction**

Choose between click-to-reveal or hover-to-reveal modes. Info boxes animate in with smooth scale and fade transitions powered by Framer Motion, and automatically reposition on window resize.

**Full Style Control Customize**

Every detail, spot size, colors, border radius, borders, box shadows, backdrop blur, and fonts. Style the info box independently with its own background, padding, border radius, shadow, and typography.

**Smart Info Box Positioning**

Info boxes automatically position themselves relative to each spot based on your chosen direction, with configurable offset, width, and max height to fit your layout perfectly.

**Refund Policy**

All sales are final. Since our products are digital and provide instant access to the Framer code component, we cannot offer refunds, exchanges, or cancellations.

Please review all product details and previews before purchasing. If you have any questions, contact us and we will be glad to assist before checkout.

By completing your purchase, you agree to this policy.

## Rank history [How rankings work →](/terms#rankings)

-   All · #8522

## Details

- **Author**: Feux Design
- **Price**: $12.00
- **Published**: 2026-03-04
- **Updated**: 2026-03-04
- **Added**: 2026-02-21
- **Categories**: Backgrounds

## More like this

-   [Pixel Flicker](/component/pixel-flicker) — Design Foundry · $10 — premium animated pixel background
-   [Fractal Glass Wave](/component/fractal-glass-wave) — Hienn Ng · $3 — Dynamic Fractal Glass Background
-   [Particle Flow Pro](/component/particle-flow-pro) — Interface Studio · $10 — Bring Your Background to Life
-   [Silk Gradient](/component/silk-gradient) — Kaisa A · Free — Silk Gradient Background