diff --git a/src/_data/blogroll.js b/src/_data/blogroll.js
new file mode 100644
index 0000000..3ab57f5
--- /dev/null
+++ b/src/_data/blogroll.js
@@ -0,0 +1,80 @@
+const blogroll = [
+  {
+    title: "Rach Smith's Digital Garden",
+    url: "https://rachsmith.com/",
+  },
+  {
+    title: "Robb Knight",
+    url: "https://rknight.me/",
+  },
+  {
+    title: "Stephanie Stimac",
+    url: "https://stephaniestimac.com/",
+  },
+  {
+    title: "Lene Saile",
+    url: "https://www.lenesaile.com/en/",
+  },
+  {
+    title: "Chris Nicholas",
+    url: "https://chrisnicholas.dev/",
+  },
+  {
+    title: "Katherine Yang",
+    url: "https://kayserifserif.place/",
+  },
+  {
+    title: "Alice Bartlett",
+    url: "https://alicebartlett.co.uk/",
+  },
+  {
+    title: "Arcana Computer",
+    url: "https://www.arcana.computer/",
+  },
+  {
+    title: "Jonas Downey,",
+    url: "https://jonas.do/",
+  },
+  {
+    title: "Robin Rendle",
+    url: "https://robinrendle.com/",
+  },
+  {
+    title: "Robb Owen",
+    url: "https://robbowen.digital/",
+  },
+  {
+    title: "CSS in Real Life",
+    url: "https://css-irl.info/",
+  },
+  {
+    title: "Ryan Mulligan",
+    url: "https://ryanmulligan.dev/",
+  },
+  {
+    title: "cliophate",
+    url: "https://cliophate.wtf/",
+  },
+  {
+    title: "Ryan P. Randall",
+    url: "https://www.ryanpatrickrandall.com/",
+  },
+  {
+    title: "Aleksandr Hovhannisyan",
+    url: "https://www.aleksandrhovhannisyan.com/",
+  },
+  {
+    title: "Casey Williams",
+    url: "https://cassidoo.co/",
+  },
+  {
+    title: "Chris Coyier",
+    url: "https://chriscoyier.net/",
+  },
+  {
+    title: "Winnie Lim",
+    url: "https://winnielim.org/",
+  },
+];
+
+module.exports = blogroll;
diff --git a/src/content/pages/blogroll.html b/src/content/pages/blogroll.html
new file mode 100644
index 0000000..3b28505
--- /dev/null
+++ b/src/content/pages/blogroll.html
@@ -0,0 +1,24 @@
+---
+layout: base
+permalink: /blogroll/index.html
+title: Blogroll
+---
+
+<section class="[ flow ]">
+    <h1>Blogroll</h1>
+    <p>A collection of my favourite sites, in no particular order.</p>
+    <p>
+        If you're looking for more cool sites, visit <a href="https://blogroll.org"
+    target="_blank"
+    rel="external noreferrer noopener">blogroll.org</a>!
+    </p>
+    <ul>
+        {% for item in blogroll %}
+            <li>
+                <a href="{{ item.url }}"
+                   target="_blank"
+                   rel="external noreferrer noopener">{{ item.title }}</a>
+            </li>
+        {% endfor %}
+    </ul>
+</section>
diff --git a/src/content/pages/blogroll.md b/src/content/pages/blogroll.md
deleted file mode 100644
index e25feff..0000000
--- a/src/content/pages/blogroll.md
+++ /dev/null
@@ -1,71 +0,0 @@
----
-layout: base
-permalink: /blogroll/index.html
-title: Blogroll
----
-
-# Blogroll
-
-A collection of my favourite sites, in no particular order.
-
-If you're looking for more cool sites, visit blogroll.org!
-
-LMNT
-https://lmnt.me/
-
-Rach Smith's Digital Garden
-https://rachsmith.com/
-
-Robb Knight
-https://rknight.me/
-
-Stephanie Stimac
-https://stephaniestimac.com/
-
-Lene Saile
-https://www.lenesaile.com/en/
-
-Chris Nicholas
-https://chrisnicholas.dev/
-
-Katherine Yang
-https://kayserifserif.place/
-
-Alice Bartlett
-https://alicebartlett.co.uk/
-
-Arcana Computer
-https://www.arcana.computer/
-
-Jonas Downey
-https://jonas.do/
-
-Robin Rendle
-https://robinrendle.com/
-
-Robb Owen
-https://robbowen.digital/
-
-CSS In Real Life
-https://css-irl.info/
-
-Ryan Mulligan
-https://ryanmulligan.dev/
-
-cliophate
-https://cliophate.wtf/
-
-Ryan P. Randall
-https://www.ryanpatrickrandall.com
-
-Aleksandr Hovhannisyan
-https://www.aleksandrhovhannisyan.com/
-
-Casey Williams
-https://cassidoo.co/
-
-Chris Coyier
-https://chriscoyier.net
-
-Winnie Lim
-https://winnielim.org