---
title: "Cursor Ring Field — Free Framer component · Best of Framer"
description: "Free Framer component · by Rohit Anand · Cursors. Cursor Ring Field An interactive WebGL particle field that reacts to your cursor with a dynamic expanding ring."
canonical: "https://framer.elliotli.dev/component/cursor-ring-field"
---

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

# Cursor Ring Field

Interactive Grid Background

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

![Cursor Ring Field preview image 1](https://framer.elliotli.dev/og/component/cursor-ring-field/7858567c37a2250e/1600x1067.jpg)

## Summary

Cursor Ring Field An interactive WebGL particle field that reacts to your cursor with a dynamic expanding ring.

## Description

### Cursor Ring Field

An interactive WebGL particle field that reacts to your cursor with a dynamic expanding ring. Hundreds of soft capsule-shaped particles form a subtle grid across the entire background, while the cursor creates a wave of movement, scale, and color around it.

Live Preview: [https://hoverinteractive.framer.website/](https://hoverinteractive.framer.website/)

**Features**

-   Interactive cursor-following ring
    
-   Smooth particle displacement and physics
    
-   Poisson-scattered particle field
    
-   Subtle background dot grid
    
-   Customizable colors
    
-   Adjustable particle density and size
    
-   Ring radius, width, push, and turbulence controls
    
-   Adjustable animation speed
    
-   Responsive to any frame size
    
-   GPU-accelerated WebGL rendering
    
-   Works as a Framer Code Component
    
-   Lightweight with no Three.js dependency
    

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

-   All · #6905

## Details

- **Author**: Rohit Anand
- **Published**: 2026-08-25
- **Updated**: 2026-08-26
- **Added**: 2026-08-25
- **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…
