diff --git a/public/toggle-theme.js b/public/toggle-theme.js
index 23ad32e58..bea85d781 100644
--- a/public/toggle-theme.js
+++ b/public/toggle-theme.js
@@ -27,6 +27,23 @@ function reflectPreference() {
   document.firstElementChild.setAttribute("data-theme", themeValue);
 
   document.querySelector("#theme-btn")?.setAttribute("aria-label", themeValue);
+
+  // Get a reference to the body element
+  const body = document.body;
+
+  // Check if the body element exists before using getComputedStyle
+  if (body) {
+    // Get the computed styles for the body element
+    const computedStyles = window.getComputedStyle(body);
+
+    // Get the background color property
+    const bgColor = computedStyles.backgroundColor;
+
+    // Set the background color in <meta theme-color ... />
+    document
+      .querySelector("meta[name='theme-color']")
+      ?.setAttribute("content", bgColor);
+  }
 }
 
 // set early so no page flashes / CSS is made aware
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 05ae788e5..1373076a7 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -63,6 +63,8 @@ const socialImageURL = new URL(
       rel="stylesheet"
     />
 
+    <meta name="theme-color" content="" />
+
     {
       // If PUBLIC_GOOGLE_SITE_VERIFICATION is set in the environment variable,
       // include google-site-verification tag in the heading