diff --git a/tabby-core/src/services/themes.service.ts b/tabby-core/src/services/themes.service.ts
index 09418068..44935e72 100644
--- a/tabby-core/src/services/themes.service.ts
+++ b/tabby-core/src/services/themes.service.ts
@@ -64,8 +64,9 @@ export class ThemesService {
         const vars: Record<string, string> = {}
         const contrastPairs: string[][] = []
 
+        vars['--body-bg'] = background.string()
         if (this.findCurrentTheme().followsColorScheme) {
-            vars['--bs-body-bg'] = background.string()
+            vars['--bs-body-bg'] = theme.background
             vars['--bs-body-color'] = theme.foreground
             vars['--bs-black'] = theme.colors[0]
             vars['--bs-red'] = theme.colors[1]
diff --git a/tabby-core/src/theme.new.scss b/tabby-core/src/theme.new.scss
index 4d20d737..8b3e3eed 100644
--- a/tabby-core/src/theme.new.scss
+++ b/tabby-core/src/theme.new.scss
@@ -56,7 +56,7 @@ app-root {
 
                     &.active {
                         color: var(--theme-fg-less-2);
-                        background: var(--bs-body-bg);
+                        background: var(--body-bg);
                     }
                 }
             }
@@ -65,7 +65,7 @@ app-root {
 }
 
 tab-body {
-    background: var(--bs-body-bg);
+    background: var(--body-bg);
 }
 
 $tab-border-radius: 5px;
@@ -80,6 +80,7 @@ $form-switch-width: 2.5em;
 @import "./theme.vendor.scss";
 
 body {
+    background: var(--body-bg);
     --bs-border-color: var(--theme-bg-more-2);
     --bs-form-control-bg: var(--theme-bg-more-2);
     --bs-emphasis-color: var(--theme-fg-less-2);