diff --git a/frontend/src/themes/default.ts b/frontend/src/themes/default.ts
deleted file mode 100644
index 866ad28..0000000
--- a/frontend/src/themes/default.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { ThemeOptions } from "@mui/material/styles";
-
-const primary = "#00695C";
-const secondary = "#DC7633";
-const warning = "#ff9800";
-const success = "#4caf50";
-const info = "#2196f3";
-
-export const theme: ThemeOptions = {
-  palette: {
-    mode: "light",
-    primary: {
-      main: primary
-    },
-    secondary: {
-      main: secondary
-    },
-    warning: {
-      main: warning
-    },
-    success: {
-      main: success
-    },
-    info: {
-      main: info
-    }
-  }
-};
-
-export default theme;
diff --git a/frontend/src/themes/defaults.ts b/frontend/src/themes/defaults.ts
new file mode 100644
index 0000000..f67f981
--- /dev/null
+++ b/frontend/src/themes/defaults.ts
@@ -0,0 +1,55 @@
+import { ThemeOptions } from "@mui/material/styles";
+
+const primary = "#00695C";
+const secondary = "#DC7633";
+const warning = "#ff9800";
+const success = "#4caf50";
+const info = "#2196f3";
+
+// background_default: "#f4f5fd",
+
+export const commonTheme: ThemeOptions = {
+  palette: {
+    primary: {
+      main: primary
+    },
+    secondary: {
+      main: secondary
+    },
+    warning: {
+      main: warning
+    },
+    success: {
+      main: success
+    },
+    info: {
+      main: info
+    }
+  }
+};
+
+const lightThemeOptions: ThemeOptions = {
+  ...commonTheme,
+  palette: {
+    ...commonTheme.palette,
+    mode: "light",
+    background: {
+      default: "#fafafa",
+      paper: "#fff"
+    }
+  }
+};
+
+const darkThemeOptions: ThemeOptions = {
+  ...commonTheme,
+  palette: {
+    ...commonTheme.palette,
+    mode: "dark",
+    background: {
+      default: "#303030",
+      paper: "#424242"
+    }
+  }
+};
+
+export { lightThemeOptions, darkThemeOptions };
diff --git a/frontend/src/themes/index.ts b/frontend/src/themes/index.ts
index d3c6815..6d3298b 100644
--- a/frontend/src/themes/index.ts
+++ b/frontend/src/themes/index.ts
@@ -1,4 +1,4 @@
-import defaultTheme from "./default";
+import { lightThemeOptions, darkThemeOptions } from "./defaults";
 import { createTheme, Theme } from "@mui/material/styles";
 
 type Themes = {
@@ -29,11 +29,10 @@ const overrides = {
 };
 
 const getThemes = (darkMode: boolean): Themes => {
-  const type = darkMode ? "dark" : "light";
+  const defaultTheme = darkMode ? darkThemeOptions : lightThemeOptions;
   const dTheme = createTheme({
     ...defaultTheme,
-    ...overrides,
-    palette: { ...defaultTheme.palette, mode: type }
+    ...overrides
   });
 
   return {