Arcflux

## ✦ A shape that crackles, glows and follows your cursor.

Arcflux is a WebGL shape with a lightning-bright edge and thousands of floating particles inside. Hover and it heats up. Click and it bursts. Drop it on the canvas, pick a color, and it's alive. No code needed.

Start with a circle, polygon, star, flower or squircle. Or bring your own: paste SVG code or upload an SVG, and Arcflux wraps the whole effect around your logo mark or icon.

## ⚙ What you can tweak

Shape ✦ Custom SVG (paste or upload) ✦ Sides ✦ Roundness ✦ Depth ✦ Rotation ✦ Color ✦ Dark & light theme ✦ Size ✦ Speed ✦ Intro animation ✦ Strands ✦ Crackle ✦ Flares ✦ Glow ✦ Sparks ✦ Particle count ✦ Particle shape ✦ Fill ✦ Motion (rise, fall, drift, orbit) ✦ 3D depth ✦ Sway ✦ Twinkle ✦ Haze ✦ Dust speed

## 🎯 Great for

Hero sections ✦ Logo reveals ✦ AI and tech landing pages ✦ Portfolio intros ✦ Product launches ✦ Loading moments ✦ Backgrounds with attitude

## 🖱 Interactions

Hover heats the edge ✦ Moving your cursor stirs the particles ✦ Click for an energy burst ✦ Smooth intro animation

## 📱 Built to behave

It fills whatever frame you give it, pauses when off-screen, respects reduced-motion settings, and shows a still frame on the Framer canvas so your editor stays fast. There's also an optional label for screen readers.

## ⚠ Good to know

Arcflux uses WebGL2, which current browsers support. For custom SVGs, solid shapes work best. Very thin line art looks softer, and the small spark arcs only appear on the built-in shapes.

––––––––

Built something cool with it? I'd love to see it. Questions or tweaks? Email sohailansari895@gmail.com or find me on X: https://x.com/sohaildesigns_