---
title: "Spotlight Cursor — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Shams Digital · Cursors. About this Component The Spotlight Image component brings a professional, interactive spotlight effect to your Framer projects."
canonical: "https://framer.elliotli.dev/component/spotlight-cursor"
---

[Home](/)/[Components](/components)/[Cursors](/components/category/cursors)/Spotlight Cursor

# Spotlight Cursor

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

![Spotlight Cursor preview image 1](https://framer.elliotli.dev/og/component/spotlight-cursor/690107270f06cd54/1600x1200.jpg)

## Summary

About this Component The Spotlight Image component brings a professional, interactive spotlight effect to your Framer projects.

## Description

## About this Component

The **Spotlight Image** component brings a professional, interactive spotlight effect to your Framer projects. It lets you control how an image is revealed under the cursor using customizable gradients, blend modes, and spring-based motion. Ideal for portfolios, landing pages, or any design where you want to highlight visuals with an engaging and modern interaction.

With full property control over cursor styles, overlay effects, and background fitting, this component adapts seamlessly to both subtle UI flourishes and bold, eye-catching hero effects.

## Features

-   **Spotlight Reveal Effect** powered by cursor position
    
-   **Customizable Gradient** (inner & outer colors, opacity)
    
-   **Blend Modes** for overlay color (normal, multiply, overlay, screen, darken, lighten)
    
-   **Cursor Styles**: Default, Inverted, or Hidden
    
-   **Spring Physics Option** for smooth, natural cursor motion
    
-   **Adjustable Spotlight Size** with pixel-based control
    
-   **Responsive Background Fit** (cover, contain, or fill)
    
-   **Configurable Image Opacity & Overlay Color**
    
-   **Lightweight and fully optimized** for FramerAbout this
    
    ## Component
    
    The **Spotlight Image** component brings a professional, interactive spotlight effect to your Framer projects. It lets you control how an image is revealed under the cursor using customizable gradients, blend modes, and spring-based motion. Ideal for portfolios, landing pages, or any design where you want to highlight visuals with an engaging and modern interaction.
    
    With full property control over cursor styles, overlay effects, and background fitting, this component adapts seamlessly to both subtle UI flourishes and bold, eye-catching hero effects.
    
    ## Features
    
    -   **Spotlight Reveal Effect** powered by cursor position
        
    -   **Customizable Gradient** (inner & outer colors, opacity)
        
    -   **Blend Modes** for overlay color (normal, multiply, overlay, screen, darken, lighten)
        
    -   **Cursor Styles**: Default, Inverted, or Hidden
        
    -   **Spring Physics Option** for smooth, natural cursor motion
        
    -   **Adjustable Spotlight Size** with pixel-based control
        
    -   **Responsive Background Fit** (cover, contain, or fill)
        
    -   **Configurable Image Opacity & Overlay Color**
        
    -   **Lightweight and fully optimized** for Framer
        

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

-   All · #7522

## Details

- **Author**: Shams Digital
- **Price**: $9.00
- **Published**: 2025-11-11
- **Updated**: 2025-11-10
- **Added**: 2025-10-28
- **Categories**: Cursors

## More like this

-   [Ribbon Hero](/component/ribbon-hero) — Divyesh WebCraft · Free — 3D ribbon with smooth motion
-   [Spider Hunt](/component/spider-hunt) — Karim Saif · $6 — ٍpider that tracks your cursor
-   [Pixel Fluid](/component/pixel-fluid) — Jamik · $12 — Fluid cursor trail in pixels/ASCII
-   [CursorImageTrail](/component/cursorimagetrail) — princeee · $20 — Image Trail is a dynamic Framer component that creates an immersive hover experience by displaying a sequence of images that trail behind…