diff --git a/src/components/Header.astro b/src/components/Header.astro
index 9fc1574..4fa7d42 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -2,22 +2,11 @@
 import Navigation from "./Navigation.astro";
 ---
 
-<style>
-  a {
-    /* TODO */
-    font-family:
-      jost,
-      -apple-system,
-      BlinkMacSystemFont,
-      sans-serif;
-  }
-</style>
-
 <header class="flex items-center justify-between">
   <div class="flex">
     <a
       href="/"
-      class="no-underline tracking-wide transition-colors duration-200 hover:text-[var(--grey-2)]"
+      class="font-jost no-underline tracking-wide transition-colors duration-200 hover:text-[var(--grey-2)]"
     >
       Jens Rømer
     </a>
diff --git a/src/styles/global.css b/src/styles/global.css
index 97e1fa7..3a5a217 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -3,6 +3,10 @@
 /* @import "tailwindcss/preflight.css" layer(base); */
 @import "tailwindcss/utilities.css" layer(utilities);
 
+@theme {
+  --font-jost: jost, -apple-system, BlinkMacSystemFont, sans-serif;
+}
+
 @layer base {
   :root {
     --grey-1: #c7c7c7;