diff --git a/doc/diagram.md b/doc/diagram.md
new file mode 100644
index 0000000000000..ae167efc9d32a
--- /dev/null
+++ b/doc/diagram.md
@@ -0,0 +1,11 @@
+<div style="max-width: 400px; margin: auto; font-size: 1.3em;">
+  <div style="background-color: #0068C3; margin: 15px; padding: 25px; text-align: center; color: white;">
+    <h5 style="margin: 0;">Parser</h5>Turns code into AST
+  </div>
+  <div style="background-color: #B22D25; margin: 15px; padding: 25px; text-align: center; color: white;">
+    <h5 style="margin: 0;">Transformer</h5>Manipulates AST
+  </div>
+  <div style="background-color: #208E2C; margin: 15px; padding: 25px; text-align: center; color: white;">
+    <h5 style="margin: 0;">Generator</h5>Turns AST back into code
+  </div>
+</div>