Glow Cursor

Shader-powered light trail that smoothly follows the pointer with customizable glow, color, taper and pulse.

Default

Every prop is wired to the controls underneath. Move the pointer across the stage to draw the trail. The trail only lives inside this stage.

Move Your Cursor

Customize

Head Color

Tail Color

Blend Mode

Trail Length40

Trail Width8px

Trail Taper0.8

Follow Speed0.16

Glow Intensity1.9

Glow Spread1.2

Hotspot0.65

Brightness1.25

Opacity1

Pulse Speed1.1

Noise0.035

Idle Timeout700ms

Fade Duration900ms

Max DPR1.5

Idle FadeEnabled

API Reference

GlowCursor

Prop	Type	Default	Description
`color`	`string`	`'#67E8F9'`	Color at the bright head of the trail.
`secondaryColor`	`string`	`'#A78BFA'`	Color blended into the end of the trail.
`trailLength`	`number`	`40`	Number of smoothed points used to build the trail, from 2 to 64.
`trailWidth`	`number`	`8`	Width of the luminous trail core in pixels.
`trailTaper`	`number`	`0.8`	How strongly the trail narrows and dims toward its tail.
`followSpeed`	`number`	`0.16`	How quickly the glowing head catches the pointer.
`glowIntensity`	`number`	`1.9`	Strength of the soft inverse-square halo around the trail.
`glowSpread`	`number`	`1.2`	Distance the outer glow spreads from the trail core.
`hotspot`	`number`	`0.65`	Amount of white-hot color added to the brightest part of the trail.
`brightness`	`number`	`1.25`	Final luminance multiplier for the shader.
`opacity`	`number`	`1`	Overall trail opacity.
`pulseSpeed`	`number`	`1.1`	Speed of the energy pulse travelling through the trail. Set to 0 to stop it.
`noiseStrength`	`number`	`0.035`	Amount of fine animated texture in the glow.
`idleFade`	`boolean`	`true`	Fade the effect when the pointer stops or leaves the container.
`idleTimeout`	`number`	`700`	Idle time in milliseconds before fading begins.
`fadeDuration`	`number`	`900`	Approximate duration of the idle fade in milliseconds.
`blendMode`	`'normal' \| 'screen' \| 'plus-lighter'`	`'screen'`	CSS blend mode used to composite the canvas over its content.
`maxDevicePixelRatio`	`number`	`1.5`	Render-resolution cap for balancing sharpness and GPU cost.
`enabled`	`boolean`	`true`	Enable or fade out the cursor effect.
`default slot`	`VNode`	-	Optional content rendered beneath the interactive trail.

Accessibility

Keyboard shortcuts and ARIA behavior.

Purely decorative canvas with pointer-events disabled, so the content underneath stays interactive. Turn off the effect with enabled for users who prefer reduced motion.

Glare Hover Gradual Blur