diff --git a/Client/src/Utils/Theme.js b/Client/src/Utils/Theme.js
new file mode 100644
index 000000000..5ad9df5c8
--- /dev/null
+++ b/Client/src/Utils/Theme.js
@@ -0,0 +1,18 @@
+import { createTheme } from "@mui/material";
+
+// Colors for MUI theme
+const secondaryMain = "#475467";
+const tertiaryMain = "#475467";
+
+const theme = createTheme({
+  palette: {
+    secondary: {
+      main: secondaryMain,
+    },
+    tertiary: {
+      main: tertiaryMain,
+    },
+  },
+});
+
+export default theme;
diff --git a/Client/src/main.jsx b/Client/src/main.jsx
index 8cb8bd9ec..b39e60580 100644
--- a/Client/src/main.jsx
+++ b/Client/src/main.jsx
@@ -1,13 +1,16 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App.jsx'
-import './index.css'
-import { BrowserRouter as Router, HashRouter } from 'react-router-dom'
-
-ReactDOM.createRoot(document.getElementById('root')).render(
+import React from "react";
+import ReactDOM from "react-dom/client";
+import App from "./App.jsx";
+import "./index.css";
+import { BrowserRouter as Router, HashRouter } from "react-router-dom";
+import theme from "./Utils/Theme.js";
+import { ThemeProvider } from "@mui/material";
+ReactDOM.createRoot(document.getElementById("root")).render(
   <React.StrictMode>
-    <Router>
-      <App />
-    </Router>
-  </React.StrictMode>,
-)
+    <ThemeProvider theme={theme}>
+      <Router>
+        <App />
+      </Router>
+    </ThemeProvider>
+  </React.StrictMode>
+);