diff --git a/frontend/apps/remark42/app/embed.ts b/frontend/apps/remark42/app/embed.ts
index e444ac52..ae1a6eea 100644
--- a/frontend/apps/remark42/app/embed.ts
+++ b/frontend/apps/remark42/app/embed.ts
@@ -116,6 +116,7 @@ function createInstance(config: typeof window.remark_config) {
 
   function changeTheme(theme: Theme) {
     window.remark_config.theme = theme;
+    iframe.style.colorScheme = theme;
     postMessageToIframe(iframe, { theme });
   }
 
diff --git a/frontend/apps/remark42/app/remark.tsx b/frontend/apps/remark42/app/remark.tsx
index 98a96941..c129071a 100644
--- a/frontend/apps/remark42/app/remark.tsx
+++ b/frontend/apps/remark42/app/remark.tsx
@@ -40,15 +40,20 @@ async function init(): Promise<void> {
 
     if (data.theme === 'light') {
       document.body.classList.remove('dark');
+      document.documentElement.style.colorScheme = 'light';
     }
 
     if (data.theme === 'dark') {
       document.body.classList.add('dark');
+      document.documentElement.style.colorScheme = 'dark';
     }
   });
 
   if (theme === 'dark') {
     document.body.classList.add('dark');
+    document.documentElement.style.colorScheme = 'dark';
+  } else {
+    document.documentElement.style.colorScheme = 'light';
   }
 
   boundActions.fetchHiddenUsers();
diff --git a/frontend/apps/remark42/app/utils/create-iframe.ts b/frontend/apps/remark42/app/utils/create-iframe.ts
index bd577453..6f694113 100644
--- a/frontend/apps/remark42/app/utils/create-iframe.ts
+++ b/frontend/apps/remark42/app/utils/create-iframe.ts
@@ -20,7 +20,7 @@ export function createIframe({ __colors__, styles, ...params }: Params) {
     padding: 0,
     margin: 0,
     overflow: 'hidden',
-    colorScheme: 'none',
+    colorScheme: params.theme === 'dark' ? 'dark' : 'light',
     ...styles,
   });