diff --git a/docs/astro.config.ts b/docs/astro.config.ts
index 182c5bf1..9aadb0c9 100644
--- a/docs/astro.config.ts
+++ b/docs/astro.config.ts
@@ -1,5 +1,6 @@
 import { defineConfig } from "astro/config";
 import starlight from "@astrojs/starlight";
+import starlightCatppuccin from '@catppuccin/starlight'
 
 export default defineConfig({
   site: "https://dotfiles.isabelroses.com",
@@ -15,10 +16,14 @@ export default defineConfig({
           href: "https://github.com/isabelroses/dotfiles",
         },
       ],
+      plugins: [starlightCatppuccin({
+        dark: { flavor: "mocha", accent: "sapphire" },
+        light: { flavor: "latte", accent: "sapphire" },
+      })],
+      customCss: ["./src/styles/custom.css"],
       editLink: {
         baseUrl: "https://github.com/isabelroses/dotfiles/edit/main/docs/src/content/docs/",
       },
-      customCss: ["./src/styles/catppuccin.css"],
       sidebar: [
         { label: "Introduction", slug: "introduction" },
         {
diff --git a/docs/package-lock.json b/docs/package-lock.json
index 9bf46a27..f06d2597 100644
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.1",
       "dependencies": {
         "@astrojs/starlight": "^0.38.4",
+        "@catppuccin/starlight": "^2.0.1",
         "astro": "^6.1.10"
       }
     },
@@ -229,6 +230,19 @@
         "node": ">=18"
       }
     },
+    "node_modules/@catppuccin/starlight": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@catppuccin/starlight/-/starlight-2.0.1.tgz",
+      "integrity": "sha512-+ddv7PS8z0E+eae92KYVPTKl3f7zi6Rz/y1aLC0pleybtHfvqrM4eHRa5TUS9R5xfXEcoFWShDw3rPBJ4sBF9g==",
+      "license": "MIT",
+      "dependencies": {
+        "@astrojs/starlight": "^0.38.0"
+      },
+      "peerDependencies": {
+        "@astrojs/starlight": ">=0.38",
+        "astro": "^6.0.0"
+      }
+    },
     "node_modules/@clack/core": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/@clack/core/-/core-1.3.0.tgz",
diff --git a/docs/package.json b/docs/package.json
index 2655afd5..1f5d471a 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "@astrojs/starlight": "^0.38.4",
+    "@catppuccin/starlight": "^2.0.1",
     "astro": "^6.1.10"
   }
 }
diff --git a/docs/src/styles/catppuccin.css b/docs/src/styles/catppuccin.css
deleted file mode 100644
index 7a8bc114..00000000
--- a/docs/src/styles/catppuccin.css
+++ /dev/null
@@ -1,70 +0,0 @@
-/* Catppuccin colour palette for Starlight.
- * Mocha for dark mode, Latte for light mode.
- * https://github.com/catppuccin/catppuccin
- */
-
-:root {
-  --sl-font: "Inter", ui-sans-serif, system-ui, sans-serif;
-  --sl-font-mono: "JetBrains Mono", ui-monospace, monospace;
-}
-
-/* Mocha (dark) */
-:root,
-:root[data-theme="dark"] {
-  --sl-color-accent-low: #313244;
-  --sl-color-accent: #cba6f7;
-  --sl-color-accent-high: #f5c2e7;
-
-  --sl-color-white: #cdd6f4;
-  --sl-color-gray-1: #cdd6f4;
-  --sl-color-gray-2: #bac2de;
-  --sl-color-gray-3: #a6adc8;
-  --sl-color-gray-4: #585b70;
-  --sl-color-gray-5: #45475a;
-  --sl-color-gray-6: #313244;
-  --sl-color-gray-7: #000000;
-  --sl-color-black: #010101;
-
-  --sl-color-bg: #010101;
-  --sl-color-bg-nav: #000000;
-  --sl-color-bg-sidebar: #000000;
-  --sl-color-bg-inline-code: #313244;
-
-  --sl-color-text: #cdd6f4;
-  --sl-color-text-accent: #f5c2e7;
-  --sl-color-text-invert: #010101;
-
-  --sl-color-hairline-light: #313244;
-  --sl-color-hairline: #45475a;
-  --sl-color-hairline-shade: #313244;
-}
-
-/* Latte (light) */
-:root[data-theme="light"] {
-  --sl-color-accent-low: #ccd0da;
-  --sl-color-accent: #8839ef;
-  --sl-color-accent-high: #ea76cb;
-
-  --sl-color-white: #4c4f69;
-  --sl-color-gray-1: #4c4f69;
-  --sl-color-gray-2: #5c5f77;
-  --sl-color-gray-3: #6c6f85;
-  --sl-color-gray-4: #9ca0b0;
-  --sl-color-gray-5: #bcc0cc;
-  --sl-color-gray-6: #ccd0da;
-  --sl-color-gray-7: #dce0e8;
-  --sl-color-black: #eff1f5;
-
-  --sl-color-bg: #eff1f5;
-  --sl-color-bg-nav: #e6e9ef;
-  --sl-color-bg-sidebar: #e6e9ef;
-  --sl-color-bg-inline-code: #dce0e8;
-
-  --sl-color-text: #4c4f69;
-  --sl-color-text-accent: #ea76cb;
-  --sl-color-text-invert: #eff1f5;
-
-  --sl-color-hairline-light: #ccd0da;
-  --sl-color-hairline: #bcc0cc;
-  --sl-color-hairline-shade: #ccd0da;
-}
diff --git a/docs/src/styles/custom.css b/docs/src/styles/custom.css
new file mode 100644
index 00000000..411e8f96
--- /dev/null
+++ b/docs/src/styles/custom.css
@@ -0,0 +1,9 @@
+@layer starlight, catppuccin, oled;
+
+@layer oled {
+  :root {
+    --sl-color-gray-6: #010101;
+    --sl-color-gray-7: #020202;
+    --sl-color-black: #000;
+  }
+}