diff --git a/site/AtkinsonHyperlegibleMono-Bold.woff2 b/site/AtkinsonHyperlegibleMono-Bold.woff2
new file mode 100644
index 0000000..2569be5
Binary files /dev/null and b/site/AtkinsonHyperlegibleMono-Bold.woff2 differ
diff --git a/site/AtkinsonHyperlegibleNext-Regular.woff2 b/site/AtkinsonHyperlegibleNext-Regular.woff2
new file mode 100644
index 0000000..5be2b91
Binary files /dev/null and b/site/AtkinsonHyperlegibleNext-Regular.woff2 differ
diff --git a/site/index.css b/site/index.css
index f765128..53fab2c 100644
--- a/site/index.css
+++ b/site/index.css
@@ -1,3 +1,13 @@
+@body-font {
+    font-family: AtkinsonHyperlegibleNext;
+    src: url(AtkinsonHyperlegibleNext-Regular.woff2);
+}
+
+@header-font {
+    font-family: AtkinsonHyperlegibleMono;
+    src: url(AtkinsonHyperlegibleMono-Bold.woff2);
+}
+
 .center {
     text-align: center;
     position: absolute;
@@ -18,7 +28,7 @@
         animation: fadeIn 500ms ease-in-out;
         background-color: black;
         color: white;
-        font-family: system-ui, sans-serif;
+        font-family: AtkinsonHyperlegibleNext, sans-serif;
         margin: 1em auto;
         padding: 1em;
         max-width: 50em;
@@ -74,7 +84,7 @@
         animation: fadeIn 500ms ease-in-out;
         background-color: white;
         color: black;
-        font-family: system-ui, sans-serif;
+        font-family: AtkinsonHyperlegibleNext, sans-serif;
         margin: 1em auto;
         padding: 1em;
         max-width: 50em;
@@ -126,7 +136,7 @@
 }
 
 h1, h2, h3 {
-    font-weight: normal;
+    font-family: AtkinsonHyperlegibleMono, monospace;
 }
 
 @keyframes fadeIn {