diff --git a/index.html b/index.html
index df41b803a..9ff6edb07 100644
--- a/index.html
+++ b/index.html
@@ -13,9 +13,17 @@
     <style>
       @media (prefers-color-scheme: dark) {
         body {
-          background-color: #202020;
+          /* Setting it early for background during load */
+          --bg-color: #202020;
         }
       }
+      body {
+        background-color: var(--bg-color);
+        background-image: var(--bg-img);
+        background-position: center;
+        background-size: cover;
+        background-repeat: no-repeat;
+      }
     </style>    
     <link rel="manifest" href="manifest.json">
   </head>
diff --git a/manifest.json b/manifest.json
index bd57dd388..8d22f6423 100644
--- a/manifest.json
+++ b/manifest.json
@@ -11,5 +11,6 @@
     }
   ],
   "display": "standalone",
-  "theme_color": "#000000"
+  "background_color": "#172dd7",
+  "theme_color": "#f0ff41"
 }
diff --git a/src/services/colorPaletteService.ts b/src/services/colorPaletteService.ts
index 8a9fa52c6..25f87195f 100644
--- a/src/services/colorPaletteService.ts
+++ b/src/services/colorPaletteService.ts
@@ -222,10 +222,7 @@ export const useColorPaletteService = () => {
 
     const backgroundImage = settingStore.get('Comfy.Canvas.BackgroundImage')
     if (backgroundImage) {
-      rootStyle.setProperty(
-        '--bg-img',
-        `url('${backgroundImage}') no-repeat center /cover`
-      )
+      rootStyle.setProperty('--bg-img', `url('${backgroundImage}')`)
     } else {
       rootStyle.removeProperty('--bg-img')
     }