<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.9.2/p5.js"></script>
<script src="https://unpkg.com/p5.createloop@0.3.1/dist/p5.createloop.js"></script>
<meta charset="utf-8" />
<link rel="icon" href="data:," />
</head>
<body>
<style>
html,
body {
margin: 0;
padding: 0;
}
main {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
}
canvas {
display: block;
image-rendering: pixelated;
width: 512px !important;
height: 512px !important;
display: block;
}
</style>
<main></main>
</body>
<script>
const exportGif = false;
function setup() {
createCanvas(128, 128);
if (exportGif) {
saveGif("mySketch", 128, { units: "frames", delay: 20 });
}
}
function draw() {
background("#aaaaaa");
fill(0);
circle(width / 2, height / 2, frameCount);
}
</script>
</html>