diff --git a/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts b/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts
index 32dad57a21830..cb66264d45bff 100644
--- a/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts
+++ b/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts
@@ -18,7 +18,7 @@ import { IThemeService } from '../../../../platform/theme/common/themeService.js
import { TITLE_BAR_ACTIVE_BACKGROUND, TITLE_BAR_ACTIVE_FOREGROUND, TITLE_BAR_INACTIVE_FOREGROUND, TITLE_BAR_INACTIVE_BACKGROUND, TITLE_BAR_BORDER, WORKBENCH_BACKGROUND } from '../../../common/theme.js';
import { isMacintosh, isWindows, isLinux, isWeb, isNative, platformLocale } from '../../../../base/common/platform.js';
import { Color } from '../../../../base/common/color.js';
-import { EventType, EventHelper, Dimension, append, $, addDisposableListener, prepend, reset, getWindow, getWindowId, isAncestor, getActiveDocument, isHTMLElement } from '../../../../base/browser/dom.js';
+import { EventType, EventHelper, Dimension, append, $, addDisposableListener, prepend, reset, getWindow, getWindowId, isAncestor, getActiveDocument, isHTMLElement, createMetaElement } from '../../../../base/browser/dom.js';
import { CustomMenubarControl } from './menubarControl.js';
import { IInstantiationService, ServicesAccessor } from '../../../../platform/instantiation/common/instantiation.js';
import { Emitter, Event } from '../../../../base/common/event.js';
@@ -717,6 +717,19 @@ export class BrowserTitlebarPart extends Part implements ITitlebarPart {
}) || '';
this.element.style.backgroundColor = titleBackground;
+ // Update based on selected theme
+ if (isWeb) {
+ const metaElementId = 'monaco-workbench-meta-theme-color';
+ let metaElement = mainWindow.document.getElementById(metaElementId) as HTMLMetaElement | null;
+ if (!metaElement) {
+ metaElement = createMetaElement();
+ metaElement.name = 'theme-color';
+ metaElement.id = metaElementId;
+ }
+
+ metaElement.content = titleBackground.toString();
+ }
+
if (this.appIconBadge) {
this.appIconBadge.style.backgroundColor = titleBackground;
}
diff --git a/src/vs/workbench/browser/style.ts b/src/vs/workbench/browser/style.ts
index 9f36f4a74ebf3..a065596ff6b5c 100644
--- a/src/vs/workbench/browser/style.ts
+++ b/src/vs/workbench/browser/style.ts
@@ -5,12 +5,10 @@
import './media/style.css';
import { registerThemingParticipant } from '../../platform/theme/common/themeService.js';
-import { WORKBENCH_BACKGROUND, TITLE_BAR_ACTIVE_BACKGROUND } from '../common/theme.js';
-import { isWeb, isIOS } from '../../base/common/platform.js';
-import { createMetaElement } from '../../base/browser/dom.js';
+import { WORKBENCH_BACKGROUND } from '../common/theme.js';
+import { isIOS } from '../../base/common/platform.js';
import { isSafari, isStandalone } from '../../base/browser/browser.js';
import { selectionBackground } from '../../platform/theme/common/colorRegistry.js';
-import { mainWindow } from '../../base/browser/window.js';
registerThemingParticipant((theme, collector) => {
@@ -24,22 +22,6 @@ registerThemingParticipant((theme, collector) => {
collector.addRule(`.monaco-workbench ::selection { background-color: ${windowSelectionBackground}; }`);
}
- // Update based on selected theme
- if (isWeb) {
- const titleBackground = theme.getColor(TITLE_BAR_ACTIVE_BACKGROUND);
- if (titleBackground) {
- const metaElementId = 'monaco-workbench-meta-theme-color';
- let metaElement = mainWindow.document.getElementById(metaElementId) as HTMLMetaElement | null;
- if (!metaElement) {
- metaElement = createMetaElement();
- metaElement.name = 'theme-color';
- metaElement.id = metaElementId;
- }
-
- metaElement.content = titleBackground.toString();
- }
- }
-
// We disable user select on the root element, however on Safari this seems
// to prevent any text selection in the monaco editor. As a workaround we
// allow to select text in monaco editor instances.