JSFiddle - React, Tailwind, and code Playground

by Julien Etienne

HTML

<canvas id='c'></canvas>

CSS

body {
    margin:0;
    overflow:hidden;
    background: yellow;
}
canvas {
    width:100%;
    height:100%;
}

JavaScript

var num = 666;

window.rAf = (function () {
    return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (loop) {
        window.setTimeout(callback, 1000 / 60);
    };
})();

var c = document.getElementById('c'),
    x = c.getContext('2d'),
    xWd = c.width = window.innerWidth,
    xHt = c.height = window.innerHeight;

function loop(){
for (i = 0; i < 10; i++) {
    x.strokeRect(xWd / 2, xHt / 2, num / 10, num / 10);
    x.strokeStyle = '#000';

    x.lineWidth = 2;
    x.rotate(-2* Math.PI / 180);
        x.translate(0, 1);
   
}
     x.save();
    rAf(loop);
}

rAf(loop);