diff --git a/components/Theme.tsx b/components/Theme.tsx
index c822ba5..444f896 100644
--- a/components/Theme.tsx
+++ b/components/Theme.tsx
@@ -2,6 +2,7 @@ import { FC } from 'react';
 import { ThemeProvider, DefaultTheme } from 'styled-components';
 
 const Theme: FC = ({ children }) => {
+	// TODO: put theme colors in css custom properties and put common colors here.
 	const theme: DefaultTheme = {
 		colors: {
 			dark: {
diff --git a/pages/_document.tsx b/pages/_document.tsx
index 7733739..eb8ab4c 100644
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -46,7 +46,7 @@ class Doc extends Document {
 					<script
 						dangerouslySetInnerHTML={{
 							__html: `
-								function getInitialColorMode() {
+								function getInitialTheme() {
 									const persistedColorPreference = window.localStorage.getItem('theme');
 									const hasPersistedPreference = typeof persistedColorPreference === 'string';
 
@@ -65,10 +65,10 @@ class Doc extends Document {
 								}
 
 								(() => {
-									const colorMode = getInitialColorMode();
+									const theme = getInitialTheme();
 									const root = document.documentElement;
 
-									root.style.setProperty('--theme', colorMode);
+									root.style.setProperty('--theme', theme);
 								})();
 							`
 						}}