diff --git a/astro.config.mjs b/astro.config.mjs
index 508cbec..1d33705 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -1,11 +1,28 @@
 // @ts-check
-import { defineConfig } from 'astro/config';
+import { defineConfig, fontProviders } from "astro/config";
 
-import tailwindcss from '@tailwindcss/vite';
+import tailwindcss from "@tailwindcss/vite";
 
 // https://astro.build/config
 export default defineConfig({
-  vite: {
-    plugins: [tailwindcss()]
-  }
-});
\ No newline at end of file
+    vite: {
+        plugins: [tailwindcss()]
+    },
+    fonts: [
+        {
+            provider: fontProviders.fontsource(),
+            name: "Hanken Grotesk",
+            cssVariable: "--font-hanken-grotesk"
+        },
+        {
+            provider: fontProviders.fontsource(),
+            name: "Amiri",
+            cssVariable: "--font-amiri"
+        },
+        {
+            provider: fontProviders.fontsource(),
+            name: "Maple Mono",
+            cssVariable: "--font-maple-mono"
+        }
+    ]
+});
diff --git a/src/layouts/RootLayout.astro b/src/layouts/RootLayout.astro
new file mode 100644
index 0000000..b479f5b
--- /dev/null
+++ b/src/layouts/RootLayout.astro
@@ -0,0 +1,24 @@
+---
+import { Font } from "astro:assets";
+import "../styles/global.css";
+const { title } = Astro.props;
+---
+
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+        <link rel="icon" href="/favicon.ico" />
+        <meta name="viewport" content="width=device-width" />
+        <meta name="generator" content={Astro.generator} />
+        <Font cssVariable="--font-maple-mono" />
+        <Font cssVariable="--font-hanken-grotesk" />
+        <Font cssVariable="--font-amiri" />
+        <title>{title}</title>
+    </head>
+    <body
+        class="bg-glw-base text-glw-text flex w-screen items-center justify-center"
+    >
+        <slot />
+    </body>
+</html>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 9ea5a4a..dc45a18 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,17 +1,8 @@
 ---
-
+import "../styles/global.css";
+import RootLayout from "../layouts/RootLayout.astro";
 ---
 
-<html lang="en">
-    <head>
-        <meta charset="utf-8" />
-        <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-        <link rel="icon" href="/favicon.ico" />
-        <meta name="viewport" content="width=device-width" />
-        <meta name="generator" content={Astro.generator} />
-        <title>Astro</title>
-    </head>
-    <body>
-        <h1>Astro</h1>
-    </body>
-</html>
+<RootLayout title="Goldweaver's Abode">
+    <h1>Astro</h1>
+</RootLayout>