JSFiddle - React, Tailwind, and code Playground

by balefrost

HTML

<canvas></canvas>

CSS

body {
    margin: 0;
    overflow: hidden;
}

JavaScript

var oldWidth = 0;
var oldHeight = 0;

var c = document.querySelector("canvas");
var ctx = c.getContext("2d");

function checkSize() {
    if (oldWidth !== window.innerWidth || oldHeight !== window.innerHeight) {
        c.width = oldWidth = window.innerWidth;
        c.height = oldHeight = window.innerHeight;
        ctx.beginPath();
        ctx.arc(c.width / 2, c.height / 2, Math.min(c.width, c.height) * 0.45, 0, 2 * Math.PI, false);
        ctx.closePath();
        ctx.fillStyle = '#000';
        ctx.strokeStyle = '#08f';
        ctx.fill();
        ctx.stroke();
    }
}

checkSize();

window.addEventListener("resize", checkSize);