---
title: "Index Reveal — Framer component · Best of Framer"
description: "$8.00 · Framer component · by Hamim Reza · Cursors. Cursor-follow work list with blend"
canonical: "https://framer.elliotli.dev/component/index-reveal"
---

[Home](/)/[Components](/components)/[Cursors](/components/category/cursors)/Index Reveal

# Index Reveal

Cursor-follow work list with blend

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

![Index Reveal preview image 1](https://framer.elliotli.dev/og/component/index-reveal/fa5ca71c354cd4f2/1600x1200.jpg)

## Summary

Cursor-follow work list with blend

## Description

IndexReveal is a hoverable work index for Framer where each row reveals a cursor-following preview blended in mix-blend difference mode, with a highlight bar sliding behind whichever row is active.

Most cursor-preview list components stop at a floating image that follows the pointer. IndexReveal adds two details none of them do: a difference blend mode that inverts colors where the image crosses text, and a highlight bar that glides to the active row instead of just changing text color.

### **WHAT IT DOES**

Add entries, each with a title, tag, note, and image. Hover any row and a floating image appears, following the cursor with spring physics and clipping in with a rounded reveal instead of a flat fade. The highlight bar slides to match the active row's exact position and height.

### **KEY FEATURES**

-   Mix-blend difference layer for a distinctive inverted-color preview
    
-   Spring-based cursor-follow image, adjustable follow tightness
    
-   Animated highlight bar that slides to the active row
    
-   Clip-path reveal/exit animation, not a flat fade or scale
    
-   Adjustable image scale, speed, and row spacing
    
-   Reduced-motion fallback, no cursor tracking or clip animation
    
-   Static-safe rendering shows a clean list on the Framer canvas
    
-   Full color controls, background, highlight, active/inactive text
    
-   Monospace-friendly layout suited to technical portfolios
    
-   Minimal dependencies, built on Framer Motion
    

### **WHY IT WORKS**

A cursor-following preview is common by now. The difference blend mode and tracking highlight bar give IndexReveal a distinct signature that reads as art direction, not a copied pattern.

### **PERFECT FOR**

Agency client lists, developer portfolios, case study indexes, and any Framer site presenting a browsable list of work with visual previews attached.

### **WHAT'S INCLUDED**

A single drop-in component. Add entries with title, tag, note, and image, then tune speed, follow tightness, and colors through property controls.

Drop it in, load your work, and let visitors hover through it.

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

-   All · #6881

## Details

- **Author**: Hamim Reza
- **Price**: $8.00
- **Published**: 2026-09-10
- **Updated**: 2026-09-10
- **Added**: 2026-09-10
- **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…
