Tubes Cursor
Tubes Cursor Component is an interactive trail effect that follows the user's mouse movements, creating a series of colorful, glowing tubes. Made with ThreeJS / WebGPU / WebGL.
Make it with Workshop
Build your own component with AI
Tubes Cursor Component is an interactive trail effect that follows the user's mouse movements, creating a series of colorful, glowing tubes. Made with ThreeJS / WebGPU / WebGL.
Make it with Workshop
Build your own component with AI
This component can be easily integrated into your projects. It is lightweight and optimized for performance, ensuring smooth animation without compromising the user experience.
It is customizable to fit your design needs :
Bloom : enable/disable bloom post-processing effect
Bloom treshold : brightness threshold to apply bloom
Bloom strength : intensity of the bloom effect
Bloom radius : radius of the bloom effect
Colors : Tubes colors will be selected in this range
Lights colors : Lights colors (there are 4 lights)
Light intensity : Intensity of the lights
Metalness : Tube's material metalness
Roughness : Tube's material roughness
Lerp : How fast the tubes follow the pointer
Noise : Amount of noise applied to the tubes
Sleep mode (when pointer is not over the component) : X Radius, Y Radius, Time scale 1, Time scale 2
Sleep mode examples :
Circle :
X Radius = Y Radius and Time scale 1 = Time scale 2
Infinity sign :
X Radius > Y Radius and Time scale 2 = 2 x Time scale 1
Includes :
Framer Component
Example Project Remix
Email support
