here is the bare bones setup ill be using
<!DOCTYPE html>
<html>
<head>
<title>RRJ2</title>
<style>
*{
margin: 0;
padding: 0;
}
.body {
min-height: 100vh;
}
#screen{
margin: auto;
display: block;
width: 100vmin;
height: 100vmin;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
}
</style>
</head>
<body>
<canvas id = "screen" width = "32px" height = "32px"></canvas>
<scrip>
var canvas = document.getElementById("screen");
var ctx = canvas.getContext("2d");
ctx.fillRect(0,0,32,32);
</script>
</body>
</html>