JSFiddle - React, Tailwind, and code Playground
JavaScript
var c = document.createElement('canvas');c.width = 1920;c.height = 1080;c.style='zoom:.5';document.body.appendChild(c);
var x = c.getContext('2d'), S = Math.sin, C = Math.cos, T = Math.tan, R = (r,g,b,a=1)=>"rgba("+~~r+","+~~g+","+~~b+","+a+")";
var frame = 0;setInterval(function() { u(frame++/60); }, 1000/60);
function u(t) {
c.width|=0
t?0:mx=my=1
c.onmousemove=e=>{mx=e.layerX*2-960;my=e.layerY*2-540}
A=Math.hypot(mx,my)/400
x.translate(960,540)
x.rotate(Math.atan2(my,mx))
x.lineWidth=2
circle=(X,Y,R)=>{x.beginPath();x.arc(400*X,400*Y,400*Math.abs(R),0,7);x.stroke()}
m=(a,d,R)=>{
X=d*C(a)
r=(A*A-1)/(A*A*(d*d-R*R)+2*A*X+1)
circle((r+1)/A+X*r,d*S(a)*r,R*r)
}
m(0,0,1)
m(0,0,1/3)
for(j=6;j--;)m(Math.PI/3*j+t,2/3,1/3)
}