Cursorkit
CursorKit gives you complete control over your Framer cursor. Drop it on any page and instantly replace the default cursor with something that matches your brand.
What it does:
- 5 cursor types — circle, square, SVG path, upload your own PNG/SVG, or text
- Cursor trail — fading dot trail that follows your movement
- 6 blend modes — normal, difference, exclusion, screen, overlay, multiply
- Adaptive color — auto-detects light and dark backgrounds and switches color
- Hover state — detects buttons, links, and clickable elements automatically
- Click state — scales down on click for satisfying tactile feedback
- Stop text — shows a tooltip when the cursor stops moving
- Mobile safe — automatically hidden on touch devices
- Portal rendering — works correctly across all Framer layouts
How to use:
1. Add CursorKit to any page
2. Set a fixed size (e.g. 1x1px — it renders globally via portal)
3. Choose your cursor type and color
4. Enable trail and blend mode if desired
5. Publish and enjoy
Tips:
- Use "Difference" blend mode on dark pages for a stunning invert effect
- Match your hover color to your brand accent
- Set follow speed to 2 for instant snap, lower for a smooth lag effect
ahmad shaarawy
