Cursor Shadow Text

Cursor Shadow Text is an interactive typography component for Framer that enhances text with cursor-reactive shadow movement, creating a sense of depth, dimension, and motion.

It is designed for modern web interfaces where subtle interaction and visual feedback improve engagement without overwhelming the layout.

Key features include

• Dynamic cursor-following shadow movement for text elements

• Multiple shadow styles including solid, blur, noise, and glow effects

• Support for up to five independent shadow layers

• Individual color control for each shadow layer

• Adjustable shadow distance and mouse sensitivity settings

• Full typography customization including font, size, weight, and spacing

• Responsive design optimized for all screen sizes and layouts

• Performance-optimized rendering for smooth interaction

How to use

• Drag the component onto your Framer canvas

• Enter and edit your text content in the properties panel

• Customize typography including font, size, and color

• Set number of shadow layers and assign colors individually

• Adjust shadow distance and cursor sensitivity

• Select shadow style: solid, blur, noise, or glow

Tips

• Use high contrast between text and shadow for strong visual impact

• Keep shadow layers minimal for subtle premium effects

• Best suited for bold text such as headlines and call-to-actions

• Avoid excessive blur or noise layers for performance-heavy layouts

Cursor Shadow Text adds depth and interactivity to typography, turning static text into a responsive and engaging visual experience.