diff --git a/Client/src/Utils/Theme/constants.js b/Client/src/Utils/Theme/constants.js
index 1944da40f..0626edbaa 100644
--- a/Client/src/Utils/Theme/constants.js
+++ b/Client/src/Utils/Theme/constants.js
@@ -75,7 +75,7 @@ const semanticColors = {
 			light: paletteColors.gray100,
 			dark: paletteColors.gray800,
 		},
-		constrastText: {
+		contrastText: {
 			light: paletteColors.blueGray200,
 			dark: paletteColors.blueGray200,
 		},
diff --git a/Client/src/Utils/Theme/darkTheme.js b/Client/src/Utils/Theme/darkTheme.js
index ff2c628d2..0f4a391de 100644
--- a/Client/src/Utils/Theme/darkTheme.js
+++ b/Client/src/Utils/Theme/darkTheme.js
@@ -26,7 +26,7 @@ const palette = {
 	primary: { main: primary.main.dark },
 	secondary: {
 		main: secondary.main.dark,
-		contrastText: secondary.constrastText.dark,
+		contrastText: secondary.contrastText.dark,
 		light: secondary.dark.dark,
 		dark: secondary.dark.dark,
 	},
diff --git a/Client/src/Utils/Theme/lightTheme.js b/Client/src/Utils/Theme/lightTheme.js
index e03fd9ee7..8bc6434c6 100644
--- a/Client/src/Utils/Theme/lightTheme.js
+++ b/Client/src/Utils/Theme/lightTheme.js
@@ -31,7 +31,7 @@ const palette = {
 	primary: { main: primary.main.light },
 	secondary: {
 		main: secondary.main.light,
-		contrastText: secondary.constrastText.light,
+		contrastText: secondary.contrastText.light,
 		light: secondary.dark.light,
 		dark: secondary.dark.light,
 	},