Electrify your user interface with this dynamic Electric Cursor. This component completely replaces the standard mouse pointer with a custom SVG shape constructed from animated lightning bolts.
Powered by framer-motion and procedural generation logic, every movement creates a unique, jagged path of electricity. It features a "jitter" effect that simulates live current, random branching bolts, and a fading trail that follows the user's movement. It is fully optimized to hide the system cursor automatically and includes a fallback view for the Framer canvas so it doesn't interfere with your design process.
Key Features:
⚡ Procedural Lightning: Every bolt and branch is generated mathematically for a unique, realistic look.
🖱️ Custom Pointer: Replaces the default arrow with a constructed electric bolt shape.
〰️ Dynamic Trail: A jagged electric tail follows the cursor movement and fades out smoothly.
🎨 Fully Customizable: Adjust the bolt color, glow intensity, thickness, and trail length.
🛠️ Canvas Friendly: Shows a simple placeholder in edit mode, active only in preview/publish.
How to Use
Insert: Drag the component onto your web page or frame.
Placement: Since this component uses position: fixed to cover the entire screen, you can place it anywhere in your layer hierarchy (preferably at the top to avoid organization clutter). It will automatically overlay the entire page.
Customization: Use the property panel to change the Bolt Color (e.g., Cyan or Purple), increase the Glow Intensity for a neon look, or adjust the Trail Length for a longer tail.
Preview: Press Play. The system cursor will disappear and be replaced by the electric effect.
Alpheratz
