diff --git a/src/theme/theme.ts b/src/theme/theme.ts
index 34a6dc7..cec8075 100644
--- a/src/theme/theme.ts
+++ b/src/theme/theme.ts
@@ -1,5 +1,5 @@
 import * as Colours from "@mui/material/colors"
-import { createTheme, responsiveFontSizes, Theme, ThemeOptions } from '@mui/material/styles';
+import { createTheme, darken, lighten, responsiveFontSizes, Theme, ThemeOptions } from '@mui/material/styles';
 import {
   getPrimaryColour,
   getSecondaryColour,
@@ -11,6 +11,18 @@ export function CreateTheme(themeType: "light" | "dark"): Theme {
   return responsiveFontSizes(createTheme(options(themeType)));
 }
 
+function generateBackgroundShades(baseColor: string, themeType: "light" | "dark") {
+  if(themeType==="light") return ({
+    default: lighten(baseColor, 0.90),
+    paper: lighten(baseColor, 0.75)
+  })
+
+  return {
+    default: darken(baseColor, 0.35),  // Lightens the base color for background.default
+    paper: darken(baseColor, 0.50),    // Slightly less light for background.paper
+  };
+}
+
 function options(themeType: "light" | "dark"): ThemeOptions {
   
   const signature = getSignatureColour();
@@ -19,7 +31,7 @@ function options(themeType: "light" | "dark"): ThemeOptions {
     palette: {
       primary: Colours[getPrimaryColour() as keyof typeof Colours],
       secondary: Colours[getSecondaryColour() as keyof typeof Colours],
-      background: Colours.grey,
+      background: generateBackgroundShades(Colours.grey[900], themeType),
       mode: themeType,
       bxt: {
         primaryBlue: "#005bb0",
@@ -36,20 +48,20 @@ function options(themeType: "light" | "dark"): ThemeOptions {
         alert: "#f44336"
       }
     },
-    typography: {
-      fontFamily: [
-        "Open Sans",
-        "-apple-system",
-        "BlinkMacSystemFont",
-        '"Segoe UI"',
-        '"Helvetica Neue"',
-        "Arial",
-        "sans-serif",
-        '"Apple Color Emoji"',
-        '"Segoe UI Emoji"',
-        '"Segoe UI Symbol"'
-      ].join(",")
-    },
+    // typography: {
+    //   fontFamily: [
+    //     "Open Sans",
+    //     "-apple-system",
+    //     "BlinkMacSystemFont",
+    //     '"Segoe UI"',
+    //     '"Helvetica Neue"',
+    //     "Arial",
+    //     "sans-serif",
+    //     '"Apple Color Emoji"',
+    //     '"Segoe UI Emoji"',
+    //     '"Segoe UI Symbol"'
+    //   ].join(",")
+    // },
     overrides: {
       MuiAppBar: {
         colorPrimary: {