Cursor
An animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations.
Move your mouse over the div
Installation
Examples
Cursor Follow Only
You can use only the CursorFollow (like the example below) component or the Cursor component.
Move your mouse over the div
Props
CursorProvider
| Prop | Type | Default |
|---|---|---|
children | React.ReactNode | - |
Cursor
| Prop | Type | Default |
|---|---|---|
children | React.ReactNode | - |
CursorFollow
| Prop | Type | Default |
|---|---|---|
children | React.ReactNode | - |
sideOffset? | number | 15 |
align? | 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right' | 'center' | bottom-right |
transition? | SpringOptions | { stiffness: 500, damping: 50, bounce: 0 } |