Abdullah Sharaf

CanvaMotion adds a new “Animated Background” capability to any Elementor Container or legacy Section element. It renders lightweight, GPU-friendly particle animations using the HTML5 Canvas 2D API and plain JavaScript — no external libraries, no iframes, no coding required.
Three animation types
<ul>
<li>Neural Network — Floating nodes connected by a glowing line web. Mouse repels nodes away from the cursor.</li>
<li>Particle Field — Glowing particles that drift and pulse in brightness. Mouse attracts particles magnetically toward the cursor.</li>
<li>Constellation — Sparse twinkling stars joined by dashed lines. Mouse exerts gentle gravity pulling nearby stars closer.</li>
</ul>
What you can control per container
<ul>
<li>Enable / disable animation with a single toggle</li>
<li>Choose animation type from a dropdown</li>
<li>Set dot colour, line colour, and optional canvas background colour</li>
<li>Adjust dot count (10–200), dot size (1–10 px), speed (0.1–5×), and mouse influence radius (50–400 px)</li>
<li>Live preview inside the Elementor editor — no page reload required</li>
</ul>
Performance
<ul>
<li>Animations pause automatically when scrolled out of the viewport (IntersectionObserver)</li>
<li>Canvas resizes automatically with the container (ResizeObserver)</li>
<li>JavaScript loads in the footer — zero render-blocking</li>
<li>No external HTTP requests at runtime</li>
<li>Canvas uses <code>pointer-events: none</code> — all content inside the container stays fully clickable</li>
</ul>
Compatibility
<ul>
<li>Works with modern Elementor Containers and legacy Section elements</li>
<li>Requires Elementor (free) — no Elementor Pro needed</li>
</ul>

CanvaMotion for Elementor

Animated canvas backgrounds for Elementor — Neural Network, Particle Field, and Constellation — with live preview and interactive mouse tracking.

Felix Peeters

Sparkle for Divi lets you add stunning particle animations to any Divi section, row or module by simply adding a CSS class. No shortcodes, no custom code — just copy a class and paste.
20 built-in presets:
<ul>
<li>✨ Gold Elegance</li>
<li>🌟 Silver Shimmer</li>
<li>🌸 Rose Glow</li>
<li>🎉 Rainbow Celebration</li>
<li>🔥 Fire Sparks</li>
<li>❄️ Snow Drift</li>
<li>🌿 Mint Breeze</li>
<li>💙 Neon Blue</li>
<li>💜 Neon Purple</li>
<li>❤️ Red Passion</li>
<li>💎 Focal Point</li>
<li>⭕ Circle Orbit</li>
<li>✦ Horizontal – Gold</li>
<li>✦ Horizontal – White</li>
<li>✦ Horizontal – Rainbow</li>
<li>🌠 Night Sky</li>
<li>❙ Vertical – Left</li>
<li>❙ Vertical – Right</li>
<li>↘ Diagonal – Top Left</li>
<li>↙ Diagonal – Top Right</li>
</ul>
Features:
<ul>
<li>5 particle shapes: Star, Dot, Square, Confetti, Custom (upload your own PNG)</li>
<li>6 motion types: Sparkle, Float, Fall, Spin, Float+Spin, Fall+Spin</li>
<li>Line modes: Horizontal, Vertical, Diagonal, Focal Point, Circle Orbit</li>
<li>Live Editor — floating panel to fine-tune any preset in real time directly on your page</li>
<li>Live preview on every preset card — see changes in real time in the dashboard</li>
<li>Custom presets: duplicate any preset and give it your own name, class and description</li>
<li>Undo: up to 3 snapshots per preset — step back whenever you need to</li>
<li>Apply up to 3 presets on one element simultaneously</li>
<li>Global on/off switch without removing classes</li>
<li>Respects prefers-reduced-motion for accessibility</li>
<li>Activates only when the element enters the viewport (saves CPU and battery)</li>
<li>Global particle cap prevents performance issues on busy pages</li>
<li>Pure CSS keyframes — no canvas, no heavy libraries</li>
<li>Frontend footprint under 40 KB — Live Editor loads only inside the Divi Builder, never on visitor-facing pages</li>
</ul>
How to use:
<ol>
<li>Go to Sparkle for Divi in the WordPress admin menu</li>
<li>Pick a preset and customize it to your liking</li>
<li>Click 💾 Save changes — then 📋 Copy class</li>
<li>Open any Divi section, row or module → Advanced → Attributes → Class → paste the class</li>
<li>Save your page and visit it — sparkles appear automatically!</li>
<li>Optional: click ⚡ Live Preview to open the floating Live Editor and fine-tune your preset in real time directly on the page</li>
</ol>

Sparkle for Divi

Add beautiful sparkle and particle animations to any Divi 5 section, row or module — no coding required.

CanvaMotion for Elementor vs Sparkle for Divi