diff --git a/css/tailwind.css b/css/tailwind.css
index 13ff11533..5a8a4c2f1 100644
--- a/css/tailwind.css
+++ b/css/tailwind.css
@@ -1,5 +1,6 @@
 @import 'tailwindcss';
-@config '../tailwind.config.js';
+@plugin "@tailwindcss/forms";
+@plugin '@tailwindcss/typography';
 @source '../node_modules/pliny';
 @custom-variant dark (&:where(.dark, .dark *));
 
@@ -77,6 +78,45 @@
   }
 }
 
+@layer utilities {
+  .prose {
+    & a {
+      color: var(--color-primary-500);
+      &:hover {
+        color: var(--color-primary-600);
+      }
+      & code {
+        color: var(--color-primary-400);
+      }
+    }
+    & :where(h1, h2) {
+      font-weight: 700;
+      letter-spacing: var(--tracking-tight);
+    }
+    & h3 {
+      font-weight: 600;
+    }
+    & :where(code):not(pre code) {
+      color: var(--color-indigo-500);
+    }
+  }
+
+  .prose-invert {
+    & a {
+      color: var(--color-primary-500);
+      &:hover {
+        color: var(--color-primary-400);
+      }
+      & code {
+        color: var(--color-primary-400);
+      }
+    }
+    & :where(h1, h2, h3, h4, h5, h6) {
+      color: var(--color-gray-100);
+    }
+  }
+}
+
 .task-list-item::before {
   @apply hidden;
 }
diff --git a/tailwind.config.js b/tailwind.config.js
deleted file mode 100644
index dc0ada7ec..000000000
--- a/tailwind.config.js
+++ /dev/null
@@ -1,47 +0,0 @@
-/* eslint-disable @typescript-eslint/no-require-imports */
-// @ts-check
-/** @type {import("tailwindcss").Config } */
-module.exports = {
-  theme: {
-    extend: {
-      typography: ({ theme }) => ({
-        DEFAULT: {
-          css: {
-            a: {
-              color: theme('--color-primary-500'),
-              '&:hover': {
-                color: theme('--color-primary-600'),
-              },
-              code: { color: theme('--color-primary-400') },
-            },
-            'h1,h2': {
-              fontWeight: '700',
-              letterSpacing: theme('--tracking-tight'),
-            },
-            h3: {
-              fontWeight: '600',
-            },
-            code: {
-              color: theme('--color-indigo-500'),
-            },
-          },
-        },
-        invert: {
-          css: {
-            a: {
-              color: theme('--color-pink-500'),
-              '&:hover': {
-                color: theme('--color-primary-400'),
-              },
-              code: { color: theme('--color-primary-400') },
-            },
-            'h1,h2,h3,h4,h5,h6': {
-              color: theme('--color-gray-100'),
-            },
-          },
-        },
-      }),
-    },
-  },
-  plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography')],
-}