DOCTYPE html html lang en head meta charset UTF 8 meta name viewport content width device width initial scale 1 0 title Curl Force Spin Animation title style body margin 0 overflow hidden canvas display block style head body canvas id canvas canvas script const canvas document getElementById canvas const ctx canvas getContext 2d canvas width window innerWidth canvas height window innerHeight const particles const particleCount 100 class Particle constructor x y radius color this x x this y y this radius radius this color color this radians Math random Math PI 2 this velocity 0 05 this distanceFromCenter Math random 100 50 this lastMouse x x y y update const lastPoint x this x y this y Move points over time this radians this velocity Drag effect this lastMouse x mouse x this lastMouse x 0 05 this lastMouse y mouse y this lastMouse y 0 05 Circular Motion this x this lastMouse x Math cos this radians this distanceFromCenter this y this lastMouse y Math sin this radians this distanceFromCenter this draw lastPoint draw lastPoint ctx beginPath ctx strokeStyle this color ctx lineWidth this radius ctx moveTo lastPoint x lastPoint y ctx lineTo this x this y ctx stroke ctx closePath const mouse x canvas width 2 y canvas height 2 function init for let i 0 i particleCount i const radius Math random 2 1 particles push new Particle canvas width 2 canvas height 2 radius hsl Math random 360 50 50 function animate requestAnimationFrame animate ctx fillStyle rgba 255 255 255 0 05 ctx fillRect 0 0 canvas width canvas height particles forEach particle particle update init animate Mouse Event window addEventListener mousemove event mouse x event clientX mouse y event clientY window addEventListener resize canvas width window innerWidth canvas height window innerHeight init script body html
r this y this lastMouse y Math sin this radians this distanceFromCenter this draw lastPoint draw lastPoint ctx beginPath ctx strokeStyle this color ctx lineWidth this radius ctx moveTo lastPoint x lastPoint y ctx lineTo this x this y ctx stroke ctx closePath const mouse x canvas width 2 y canvas height 2 function init for let i 0 i particleCount i const radius Math random 2 1 particles push new Particle canvas width 2 canvas height 2 radius hsl Math random 360 50 50 function animate requestAnimationFrame animate ctx fillStyle rgba 255 255 255 0 05 ctx fillRect 0 0 canvas width canvas height particles forEach particle particle update init animate Mouse Event window addEventListener mousemove event mouse x event clientX mouse y event clientY window addEventListener resize canvas width window innerWidth canvas height window innerHeight init script body html