If you want to smile
This code workable and tested in QQBrowser, Sleipnir, Chrome, Edge, Firefox, Waterfox, Falcon and others, including mobiles. It is a hybrid and is not a programming lesson. Scheme had been extremely simplified.
<!--Igor Kobzar ( private individual ). 2025 year.-->
<!DOCTYPE html>
<html lang='en'>
<head>
<style>
canvas { background: #242412; }
</style>
</head>
<canvas id="Canvas" width="1900" height="950"></canvas>
<body>
<script>
var canvas = document.getElementById("Canvas");
var t = canvas.getContext("2d");
var x = canvas.width / 2;
var y = canvas.height / 2;
var h = 1 / 3;
var s = 1 / 7;
var a = 7 / 13;
var c = 1 / 29;
var h1 = 1 / 3;
var s1 = 1 / 7;
var a1 = 7 / 13;
var c1 = 1 / 29;
function draw(){
for(var j = 1; j < 100; j++){
h = s;
s = c;
c = a;
a = a + h - Math.sign(a + h);
h1 = s1;
s1 = c1;
c1 = a1;
a1 = a1 - h1 - Math.sign(a1 - h1);
t.beginPath();
t.rect(x + 1000 * a, y + 500 * s, 100 + 100 * h, 100 + 100 * c);
t.fillStyle = "rgba(" + (120 - 100 * c1) + "," + (120 + 100 * a1) + "," + (120 - 100 * s1) + ", " + 0.5 + ")";
t.fill();
t.closePath();
}
}
setInterval(draw, 9);
</script>
</body>
</html>
You will see something like this
