diff --git a/components/DarkMode.tsx b/components/DarkMode.tsx
index efa94a0..ce8e40b 100644
--- a/components/DarkMode.tsx
+++ b/components/DarkMode.tsx
@@ -28,11 +28,13 @@ const DarkMode: FC = ({ children }) => {
 			root.style.setProperty('--background', '#F9F9F9');
 			root.style.setProperty('--secondary-background', 'white');
 			root.style.setProperty('--text', 'black');
+			root.style.setProperty('--text-inverted', 'white');
 		} else {
 			window.localStorage.setItem('theme', 'dark');
 			root.style.setProperty('--background', '#262626');
 			root.style.setProperty('--secondary-background', '#2F2F2F');
 			root.style.setProperty('--text', 'white');
+			root.style.setProperty('--text-inverted', 'black');
 		}
 
 		dispatch({ type: 'TOGGLE' });
diff --git a/components/MobileNav.tsx b/components/MobileNav.tsx
index 62815ef..aaf7d0a 100644
--- a/components/MobileNav.tsx
+++ b/components/MobileNav.tsx
@@ -45,7 +45,7 @@ const Bar = styled.nav<StyledProps>`
 		margin: 0rem 1rem;
 
 		button {
-			color: var(--text) !important;
+			color: var(--text-inverted) !important;
 		}
 	}
 `;
diff --git a/pages/_document.tsx b/pages/_document.tsx
index c64ef97..d033638 100644
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -81,6 +81,10 @@ class Doc extends Document {
 										'--text',
 										theme === 'light' ? 'black' : 'white'
 									);
+									root.style.setProperty(
+										'--text-inverted',
+										theme === 'light' ? 'white' : 'black'
+									);
 								})();
 							`
 						}}