Theme

Author: 0xnim

astro.config.mjs

@@ -29,6 +29,9 @@ export default defineConfig({
 				},
 			],
 			favicon: "/favicon.ico",
+			customCss: [
+				'src/style/theme.css',
+			],
 		}),
 	],
 });

src/style/theme.css

@@ -0,0 +1,29 @@
+/* Dark mode colors. */
+:root {
+    --sl-color-accent-low: #460b05;
+    --sl-color-accent: #c60e00;
+    --sl-color-accent-high: #feb3a6;
+    --sl-color-white: #ffffff;
+    --sl-color-gray-1: #f3ecea;
+    --sl-color-gray-2: #c8c0be;
+    --sl-color-gray-3: #978784;
+    --sl-color-gray-4: #635451;
+    --sl-color-gray-5: #423432;
+    --sl-color-gray-6: #302321;
+    --sl-color-black: #1d1715;
+}
+/* Light mode colors. */
+:root[data-theme='light'] {
+    --sl-color-accent-low: #ffc8be;
+    --sl-color-accent: #c90e00;
+    --sl-color-accent-high: #640300;
+    --sl-color-white: #1d1715;
+    --sl-color-gray-1: #302321;
+    --sl-color-gray-2: #423432;
+    --sl-color-gray-3: #635451;
+    --sl-color-gray-4: #978784;
+    --sl-color-gray-5: #c8c0be;
+    --sl-color-gray-6: #f3ecea;
+    --sl-color-gray-7: #f9f5f5;
+    --sl-color-black: #ffffff;
+}