diff --git a/packages/docs/app/routes/docs.tsx b/packages/docs/app/routes/docs.tsx
index 86b20cd..30cc91e 100644
--- a/packages/docs/app/routes/docs.tsx
+++ b/packages/docs/app/routes/docs.tsx
@@ -6,7 +6,7 @@ import { SideNav } from "~/components/side-nav"
 import { SidebarLayout } from "~/components/sidebar-layout"
 import type { ContentIndexEntry } from "~/helpers/create-index.server"
 import { createContentIndex } from "~/helpers/create-index.server"
-import { linkClass } from "~/styles"
+import { docsProseClass, linkClass } from "~/styles"
 
 type LoaderData = ContentIndexEntry[]
 
@@ -32,7 +32,7 @@ export default function Docs() {
             </SideNav>
           }
           body={
-            <section className="prose max-w-none prose-invert prose-h1:font-light flex-1 prose-h1:mb-4 prose-p:my-4 prose-pre:text-[15px] prose-pre:font-monospace prose-h2:font-light h-[200vh]">
+            <section className={docsProseClass}>
               <Outlet />
             </section>
           }
diff --git a/packages/docs/app/styles.ts b/packages/docs/app/styles.ts
index ce20a64..aafcecb 100644
--- a/packages/docs/app/styles.ts
+++ b/packages/docs/app/styles.ts
@@ -6,3 +6,13 @@ export const linkClass = clsx`
   after:absolute after:block after:w-full after:h-px after:bg-white/50 after:translate-y-[3px] after:opacity-0 after:transition
   hover:after:translate-y-[-1px] hover:after:opacity-100
 `
+
+export const docsProseClass = clsx`
+  prose prose-invert
+  prose-h1:font-light prose-h1:mb-4
+  prose-h2:font-light
+  prose-h3:font-light
+  prose-p:my-4
+  prose-pre:text-[15px] prose-pre:font-monospace
+  max-w-none
+`