---
title: "Cursor Dot Trail — Free Framer component · Best of Framer"
description: "Free Framer component · by Helder Vilela · Cursors. Cursor Dot Trail follows the pointer naturally and transforms over buttons and links, creating a subtle but expressive layer…"
canonical: "https://framer.elliotli.dev/component/cursor-dot-trail"
---

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

# Cursor Dot Trail

Cursor dot trail with hover transforms

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

![Cursor Dot Trail preview image 1](https://framer.elliotli.dev/og/component/cursor-dot-trail/999b70598e77d772/1600x1200.jpg)

## Summary

Cursor Dot Trail follows the pointer naturally and transforms over buttons and links, creating a subtle but expressive layer of interaction without a single line of code.

## Description

Cursor Dot Trail follows the pointer naturally and transforms over buttons and links, creating a subtle but expressive layer of interaction without a single line of code.

Built to feel native to Framer, the component works instantly with smart defaults and optional layer keywords to enable link mode, hide the dot, or switch to inverted colors for modals and contrasting overlays.

You have full control over size, hover scale, border width, spring physics, friction, trail length, and transition speed, allowing everything from minimal elegance to bold, magnetic behavior.

### Features

-   Smooth cursor-following dot with configurable trail
    
-   Automatic hover transformation on buttons
    
-   Optional link mode with underline support
    
-   Inverted color for modals and overlays
    
-   Fully adjustable physics and timing
    
-   Lightweight and performance friendly
    
-   Zero setup, no code required
    

### How it works

Just add a keyword to the layer name to enable effect. The layer name can be anything, or even empty, the component only looks for the exact keyword and adapts its behavior automatically.

**Available keywords/effects**

-   trail{hide} — hide the dot
    
-   trail{invert-color} — switch to the inverted color
    
-   trail{link} — activate text link mode
    

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-3g2hhr4u-g8Uy8sYBntiOduZs8WO98eBsZ1dyMN)

### Customization

Full control over size, physics, trail, and transitions, from subtle elegance to bold motion.

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-3g2hhr4u-GCIt9vwYxp2UFmpnf9WqPKXNuhXd8e)

### Questions & Support

Reach out via [**𝕏/Twitter**](https://x.com/helder_vilela) or email [**support@pixelthrone.com**](mailto:support@pixelthrone.com) — I’m here to help.

### License Notice

Not allowed to be included in redistributable templates. Contact me for a custom license.

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

-   All · #292

## Details

- **Author**: Helder Vilela
- **Published**: 2026-02-18
- **Updated**: 2026-04-29
- **Added**: 2026-02-11
- **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…
