Glass Cursor

Glass-like cursor trail with refraction and blur

glass-cursor-tw

Customize

Basic

0
0.04
40
1

Shape & Refraction

0.3
0.6
0.3
0.3

Lighting & Warp

0.15
0.2
25
5

Props

NameTypeDefaultDescription
widthstring | number"100%"Container width in pixels or CSS value
heightstring | number"100%"Container height in pixels or CSS value
classNamestringundefinedAdditional CSS classes for the container
childrenReact.ReactNodeundefinedContent rendered above the effect
srcstring"https://images.unsplash.com/..."Image source URL to apply the glass effect on
dampeningnumber0Cursor follow smoothness (0 = instant, 1 = very laggy)
blobSizenumber0.04Metaball radius in UV space
trailLengthnumber40Number of active trail points (max 40)
tailFadenumber0.3Tail shrink curve (higher = faster fade)
thresholdnumber0.6Metaball iso-surface threshold
refractionnumber0.3Gradient-based lens refraction strength
blurSpreadnumber0.3Blur sample spacing
borderGlownumber0.15Border rim brightness
specularGainnumber0.2Specular highlight intensity
blobWarpAmountnumber25Organic warp distortion amount on trail
blobWarpScalenumber5Spatial frequency of warp noise
backgroundColorstring"#000000"Background color hex
opacitynumber1Master opacity