diff --git a/app/components/exporter.module.scss b/app/components/exporter.module.scss
index 5e992e7fd..fe2a13329 100644
--- a/app/components/exporter.module.scss
+++ b/app/components/exporter.module.scss
@@ -2,6 +2,9 @@
   &-body {
     margin-top: 20px;
   }
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
 }
 
 .export-content {
diff --git a/app/components/mask.module.scss b/app/components/mask.module.scss
index d66d98864..40c78a4d9 100644
--- a/app/components/mask.module.scss
+++ b/app/components/mask.module.scss
@@ -4,6 +4,10 @@
   display: flex;
   flex-direction: column;
 
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
+
   .mask-page-body {
     padding: 20px;
     overflow-y: auto;
diff --git a/app/components/mask.tsx b/app/components/mask.tsx
index 2a6cd3984..24c726a60 100644
--- a/app/components/mask.tsx
+++ b/app/components/mask.tsx
@@ -465,8 +465,6 @@ export function MaskPage(props: { className?: string }) {
     });
   };
 
-  const isMobileScreen = useMobileScreen();
-
   return (
     <>
       <div
diff --git a/app/components/new-chat.module.scss b/app/components/new-chat.module.scss
index b291a2366..1b48659d3 100644
--- a/app/components/new-chat.module.scss
+++ b/app/components/new-chat.module.scss
@@ -8,6 +8,10 @@
   justify-content: center;
   flex-direction: column;
 
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
+
   .mask-header {
     display: flex;
     justify-content: space-between;
diff --git a/app/containers/index.tsx b/app/containers/index.tsx
index 7552d31b1..68047e7c6 100644
--- a/app/containers/index.tsx
+++ b/app/containers/index.tsx
@@ -117,7 +117,7 @@ export default function Home() {
                   <NewChat
                     className={`
               md:w-[100%] px-1
-              ${config.theme === "dark" ? "" : "bg-gray-50"}
+              ${config.theme === "dark" ? "bg-[var(--white)]" : "bg-gray-50"}
               ${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
               `}
                   />
@@ -129,7 +129,7 @@ export default function Home() {
                   <MaskPage
                     className={`
                 md:w-[100%]
-                ${config.theme === "dark" ? "" : "bg-gray-50"}
+                ${config.theme === "dark" ? "bg-[var(--white)]" : "bg-gray-50"}
                 ${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
               `}
                   />
diff --git a/app/styles/globals.scss b/app/styles/globals.scss
index 8bbbbc17f..8e2c744a2 100644
--- a/app/styles/globals.scss
+++ b/app/styles/globals.scss
@@ -38,10 +38,6 @@
   --border-in-light: 1px solid rgba(255, 255, 255, 0.192);
 
   --theme-color: var(--gray);
-
-  div:not(.no-dark) > svg {
-    filter: invert(0.5);
-  }
 }
 
 .light {