Aurora Cursor
Full-screen fluid cursor overlay for Framer. Renders colorful, responsive splashes that follow mouse/touch without blocking clicks. Fully customisable via property controls.
Make it with Workshop
Build your own component with AI
About this Component
Reacts to mouse/touch: streaks while moving, “splat” burst on click/tap.
Fully tweakable via Framer controls: Shading, Transparent BG, Back Color, Sim/Dye/Capture resolution, Density/Velocity dissipation, Pressure & Iterations, Curl, Splat Radius/Force, Color Speed.
Fixed overlay (position: fixed; inset: 0; z-index: 50) so it works across the whole page; can be scoped to a frame by switching to absolute.
Robust in Framer: binds aPosition explicitly, so the fullscreen quad always renders.
Auto-adapts for weaker GPUs: disables linear filtering + shading and lowers dye resolution when unavailable.
Clean lifecycle: cancels requestAnimationFrame and removes event listeners on unmount to avoid memory leaks between pages.
Pixel-ratio aware for crisp visuals on HiDPI screens.
Minimal footprint: single <canvas>; no external libs.
Great for heroes, page transitions, interactive delight layers, and brandable cursor trails.
Quick use: drop SplashCursor.tsx in /code, add from Code Components, place anywhere (it overlays the whole site).
