diff --git a/src/shared/components/app/app.tsx b/src/shared/components/app/app.tsx
index 5709f766..bcdf14f5 100644
--- a/src/shared/components/app/app.tsx
+++ b/src/shared/components/app/app.tsx
@@ -51,7 +51,7 @@ export class App extends Component<any, any> {
             {siteView && (
               <>
                 <Theme defaultTheme={siteView.local_site.default_theme} />
-                <CodeTheme />
+                <CodeTheme defaultTheme={siteView.local_site.default_theme} />
               </>
             )}
             <Navbar siteRes={siteRes} />
diff --git a/src/shared/components/app/code-theme.tsx b/src/shared/components/app/code-theme.tsx
index 492fbefc..9cc016ef 100644
--- a/src/shared/components/app/code-theme.tsx
+++ b/src/shared/components/app/code-theme.tsx
@@ -1,22 +1,35 @@
+import { dataBsTheme } from "@utils/browser";
 import { Component } from "inferno";
+import { Helmet } from "inferno-helmet";
+import { UserService } from "../../services";
 
-export class CodeTheme extends Component {
+interface CodeThemeProps {
+  defaultTheme: string;
+}
+
+export class CodeTheme extends Component<CodeThemeProps, any> {
   render() {
+    const user = UserService.Instance.myUserInfo;
+    const userTheme = user?.local_user_view.local_user.theme;
+    const theme =
+      user && userTheme !== "browser" ? userTheme : this.props.defaultTheme;
+
     return (
-      <>
-        <link
-          rel="stylesheet"
-          type="text/css"
-          href={`/css/code-themes/atom-one-light.css`}
-          media="(prefers-color-scheme: light)"
-        />
-        <link
-          rel="stylesheet"
-          type="text/css"
-          href={`/css/code-themes/atom-one-dark.css`}
-          media="(prefers-color-scheme: no-preference), (prefers-color-scheme: dark)"
-        />
-      </>
+      <Helmet>
+        {dataBsTheme(theme) === "dark" ? (
+          <link
+            rel="stylesheet"
+            type="text/css"
+            href={`/css/code-themes/atom-one-dark.css`}
+          />
+        ) : (
+          <link
+            rel="stylesheet"
+            type="text/css"
+            href={`/css/code-themes/atom-one-light.css`}
+          />
+        )}
+      </Helmet>
     );
   }
 }