diff --git a/client/layout/color-scheme/index.jsx b/client/layout/color-scheme/index.jsx
index ec9f8eaeeaa5c..9ddc5d8fb05e9 100644
--- a/client/layout/color-scheme/index.jsx
+++ b/client/layout/color-scheme/index.jsx
@@ -1,3 +1,4 @@
+import config from '@automattic/calypso-config';
 import { getAdminColor } from 'calypso/state/admin-color/selectors';
 import { getPreference } from 'calypso/state/preferences/selectors';
 import { getSelectedSiteId } from 'calypso/state/ui/selectors';
@@ -48,13 +49,14 @@ export function refreshColorScheme( prevColorScheme, nextColorScheme ) {
 
 	if ( nextColorScheme ) {
 		classList.add( `is-${ nextColorScheme }` );
+	}
 
+	if ( config( 'theme_color_override_with_admin_color_scheme' ) ) {
 		const themeColor = getComputedStyle( document.body )
 			.getPropertyValue( '--color-masterbar-background' )
 			.trim();
 		const themeColorMeta = document.querySelector( 'meta[name="theme-color"]' );
-		// We only adjust the `theme-color` meta content value in case we set it in `componentDidMount`
-		if ( themeColorMeta && themeColorMeta.getAttribute( 'data-colorscheme' ) === 'true' ) {
+		if ( themeColorMeta && themeColor ) {
 			themeColorMeta.content = themeColor;
 		}
 	}