---
title: "Cursor-Follow-Video  — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Konstantin Nikolaev · Cursors. Follows cursor, expands on scroll."
canonical: "https://framer.elliotli.dev/component/cursor-follow-video"
---

[Home](/)/[Components](/components)/[Cursors](/components/category/cursors)/Cursor-Follow-Video

# Cursor-Follow-Video

Follows cursor, expands on scroll.

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

![Cursor-Follow-Video  preview image 1](https://framer.elliotli.dev/og/component/cursor-follow-video/622a1b94378096c7/1600x1200.jpg)

## Summary

Follows cursor, expands on scroll.

## Description

## About this Component

### Component Details

This component is built primarily for **desktop environments** and larger screens. It is **not optimized for mobile devices**, as the interaction relies on horizontal mouse movement.

### Layout Requirements

For the scaling animation to reach the full

available screen space, the **section containing the component should be significantly taller than the component’s initial size**.

Providing sufficient scroll distance ensures a smooth and uninterrupted transition during the animation.

**Recommendation:**

-   Place the component inside a tall hero section
    
-   Avoid short or tightly constrained containers
    

### Customization Options

The component offers multiple controls to adjust layout, interaction, and playback behavior:

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-eei1x5gs-ZFThzyNUcwh2b7ferEPzLR5l04S1Ok)

Video Settings

-   **Video File** – Choose the video source
    
-   **Auto Play** – Enable or disable automatic playback
    
-   **Loop** – Repeat video playback
    
-   **Muted** – Toggle audio output
    
-   **Show Controls** – Display or hide video controls
    

Interaction & Animation

-   **Scroll Animation** – Enable or disable scroll-based scaling
    
-   **Animation End** – Adjust the scroll distance used for the animation
    
-   **Smoothness** – Control the responsiveness of cursor movement
    

Size & Position

-   **Initial Width / Height** – Starting dimensions of the video
    
-   **Final Width / Height** – Target dimensions after scaling
    
-   **Vertical Position** – Adjust vertical alignment
    
-   **Corner Radius** – Modify the rounding of the video edges
    

### Recommended Use

Well suited for:

-   Editorial-style hero sections
    
-   Portfolio websites
    
-   Desktop-focused brand experiences
    

Less suitable for:

-   Mobile-first layouts
    
-   Touch-only interfaces
    

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

-   All · #9463

## Details

- **Author**: Konstantin Nikolaev
- **Price**: $4.00
- **Published**: 2026-03-17
- **Updated**: 2026-07-09
- **Added**: 2026-03-05
- **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…