Tubes Cursor

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