diff --git a/src/components/Post.astro b/src/components/Post.astro
index 3d4d320..9f9969d 100644
--- a/src/components/Post.astro
+++ b/src/components/Post.astro
@@ -7,7 +7,7 @@ const { post } = Astro.props;
 <li class="flex flex-col text-center no-underline">
   <a href={`/blog/${post.slug}`}>
     <span
-      class="flex flex-wrap justify-center text-balance text-2xl"
+      class="flex flex-wrap justify-center text-balance text-2xl font-JetBrainsMono"
       >{post.data.title}</span
     >
     <div
diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index c6d8bed..51b0d70 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -31,7 +31,7 @@ const { Content } = await entry.render();
   <main>
     <a
       href="/"
-      class="block py-3 text-lg uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
+      class="block py-3 text-lg font-JetBrainsMono uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
       >{`← ${SITE.name}`}</a
     >
     {
@@ -44,7 +44,7 @@ const { Content } = await entry.render();
       )
     }
     <h1
-      class="mt-6 flex flex-wrap justify-center text-balance text-2xl text-lightModeForeground dark:text-darkModeForeground"
+      class="mt-6 flex flex-wrap justify-center text-balance text-2xl font-JetBrainsMono text-lightModeForeground dark:text-darkModeForeground"
     >
       {entry.data.title}
     </h1>
@@ -59,7 +59,7 @@ const { Content } = await entry.render();
     </div>
     <a
       href="/"
-      class="block py-3 text-lg uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
+      class="block py-3 text-lg font-JetBrainsMono uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
       >{`← ${SITE.name}`}</a
     >
   </main>