diff --git a/src/Home.tsx b/src/Home.tsx
index b70ef3a..4798f4f 100644
--- a/src/Home.tsx
+++ b/src/Home.tsx
@@ -202,8 +202,8 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => {
   };
   const menuTextColor = getColorByBrightness(
     context.themeManager.theme.appBarBgColor,
-    context.themeManager.theme.primary,
-    context.themeManager.theme.primaryLight
+    context.themeManager.theme.textColor,
+    context.themeManager.theme.textLightColor
   );
   return (
     <div
@@ -225,8 +225,8 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => {
             borderTopRightRadius: "1vw",
             minWidth: "10vw",
             minHeight: "1vw",
-            background: context.themeManager.theme.primary,
-            color: context.themeManager.theme.primaryLight,
+            background: context.themeManager.theme.textColor,
+            color: context.themeManager.theme.textLightColor,
           }}
         >
           {connectionStateText()}
diff --git a/src/components/BoardView.tsx b/src/components/BoardView.tsx
index 6f5a2f8..024a7ac 100644
--- a/src/components/BoardView.tsx
+++ b/src/components/BoardView.tsx
@@ -70,8 +70,8 @@ const StoreView: FunctionComponent<{
   ));
   const textColor = getColorByBrightness(
     pitViewModel.pitColor,
-    context.themeManager.theme.primary,
-    context.themeManager.theme.primaryLight
+    context.themeManager.theme.textColor,
+    context.themeManager.theme.textLightColor
   );
   return (
     <div
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 0d0499b..f1c3a30 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -11,8 +11,8 @@ const Button: FunctionComponent<{
 }> = ({ context, text, color, onClick }) => {
   const textColor = getColorByBrightness(
     color,
-    context.themeManager.theme.primary,
-    context.themeManager.theme.primaryLight
+    context.themeManager.theme.textColor,
+    context.themeManager.theme.textLightColor
   );
   return (
     <button
diff --git a/src/components/InfoPanel.tsx b/src/components/InfoPanel.tsx
index b207a05..f38ef0a 100644
--- a/src/components/InfoPanel.tsx
+++ b/src/components/InfoPanel.tsx
@@ -89,8 +89,8 @@ const InfoPanel: FunctionComponent<{
       : context.themeManager.theme.boardColor;
     const textColor = getColorByBrightness(
       containerColor,
-      context.themeManager.theme.primary,
-      context.themeManager.theme.primaryLight
+      context.themeManager.theme.textColor,
+      context.themeManager.theme.textLightColor
     );
     const text = getInfoPanelTextByGameState({
       context,
diff --git a/src/theme/Theme.ts b/src/theme/Theme.ts
index e5a9653..26a3e0f 100644
--- a/src/theme/Theme.ts
+++ b/src/theme/Theme.ts
@@ -1,8 +1,8 @@
 export type Theme = {
   id: string;
   name: string;
-  primary: string;
-  primaryLight: string;
+  textColor: string;
+  textLightColor: string;
   background: string;
   appBarBgColor: string;
   playerTurnColor: string;