Component
Follow Cursor Component for Framer
This is a follow cursor component for Framer, that lets any element smoothly follow your cursor. Feel free to copy the component to your project and customize it using the properties in the right panel.



About the resource
To use this component, just place it inside any element on your canvas, and it’ll make it follow your cursor.
The follow cursor component lets you control how a layer interacts with the cursor on your website. Smoothing
controls how smoothly the layer moves in response to the cursor.
The Alignment
option lets you choose how the layer aligns to the cursor, with both horizontal and vertical alignment available. Lastly, the Transition
setting is used to adjust the opacity transition when the Enabled
state is toggled.
About the resource
To use this component, just place it inside any element on your canvas, and it’ll make it follow your cursor.
The follow cursor component lets you control how a layer interacts with the cursor on your website. Smoothing
controls how smoothly the layer moves in response to the cursor.
The Alignment
option lets you choose how the layer aligns to the cursor, with both horizontal and vertical alignment available. Lastly, the Transition
setting is used to adjust the opacity transition when the Enabled
state is toggled.
About the resource
To use this component, just place it inside any element on your canvas, and it’ll make it follow your cursor.
The follow cursor component lets you control how a layer interacts with the cursor on your website. Smoothing
controls how smoothly the layer moves in response to the cursor.
The Alignment
option lets you choose how the layer aligns to the cursor, with both horizontal and vertical alignment available. Lastly, the Transition
setting is used to adjust the opacity transition when the Enabled
state is toggled.

The follow cursor component properties in Framer.

The follow cursor component properties in Framer.

The follow cursor component properties in Framer.