diff --git a/scripts/style.css b/scripts/style.css
index c5c636b..e205e23 100644
--- a/scripts/style.css
+++ b/scripts/style.css
@@ -287,8 +287,7 @@ body.home .h1wrap p {
   border-radius: 0.5rem;
   padding: 1rem;
   box-shadow: 0 0 #0000,0 0 #0000,0 1px 2px 0 rgba(0,0,0,0.05);
-  --text-opacity: 1;
-  color: rgb(203 213 225/var(--text-opacity));
+  color: var(--color-fg-default);
   --bg-opacity: 0.5;
   background-color: rgb(62 69 72/var(--bg-opacity));
   transition: all .3s;
diff --git a/scripts/utils/darkMode.mjs b/scripts/utils/darkMode.mjs
index 9f9ed25..7407809 100644
--- a/scripts/utils/darkMode.mjs
+++ b/scripts/utils/darkMode.mjs
@@ -2,10 +2,17 @@ import path from 'path';
 import { getSVGNode } from './getSVGNode.mjs';
 
 const scripts = `
+  const LOCAL_NANE = '_dark_mode_theme_'
+  const rememberedValue = localStorage.getItem(LOCAL_NANE);
+  if (rememberedValue && ['light', 'dark'].includes(rememberedValue)) {
+    document.documentElement.setAttribute('data-color-mode', rememberedValue);
+  }
   const button = document.querySelector('#darkMode');
   button.onclick = () => {
     const theme = document.documentElement.dataset.colorMode;
-    document.documentElement.setAttribute('data-color-mode', theme === 'light' ? 'dark' : 'light');
+    const mode = theme === 'light' ? 'dark' : 'light';
+    document.documentElement.setAttribute('data-color-mode', mode);
+    localStorage.setItem(LOCAL_NANE, mode);
   }
 `;