diff --git a/archetypes/sketch/index.md b/archetypes/sketch/index.md
new file mode 100644
index 0000000..dee4e18
--- /dev/null
+++ b/archetypes/sketch/index.md
@@ -0,0 +1,7 @@
+---
+title: "{{ replace .Name "-" " " | title }}"
+date: {{ .Date }}
+draft: true
+---
+
+{{< figures/p5 id="sketch" >}}
diff --git a/archetypes/sketch/sketch.js b/archetypes/sketch/sketch.js
new file mode 100644
index 0000000..54d2b7d
--- /dev/null
+++ b/archetypes/sketch/sketch.js
@@ -0,0 +1,20 @@
+const sketch = p => {
+    p.setup = () => {
+        const sketchContainer = document.querySelector('#sketch');
+        const canvasWidth = parseFloat(getComputedStyle(sketchContainer).width);
+        let canvas = p.createCanvas(canvasWidth, canvasWidth);
+        canvas.canvas.removeAttribute('style');
+        sketchContainer.appendChild(canvas.canvas);
+
+        p.pixelDensity(p.displayDensity());
+    };
+
+    p.draw = () => {
+        p.background(255);
+        p.strokeWeight(4);
+        p.stroke(0, 0, 255);
+        p.circle(100, 100, 100);
+    };
+};
+
+new p5(sketch, 'sketch');