diff --git a/frontend/.gitignore b/frontend/.gitignore
index d70f6e55fd..2c150d3410 100644
--- a/frontend/.gitignore
+++ b/frontend/.gitignore
@@ -7,4 +7,4 @@ coverage
 .node/
 package-lock.json
 pnpm-lock.yaml
-yarn.lock
\ No newline at end of file
+yarn.lock
diff --git a/frontend/config/plugin/arcoStyleImport.ts b/frontend/config/plugin/arcoStyleImport.ts
index e9daa6363a..3f166aa7de 100644
--- a/frontend/config/plugin/arcoStyleImport.ts
+++ b/frontend/config/plugin/arcoStyleImport.ts
@@ -9,8 +9,7 @@ import { vitePluginForArco } from '@arco-plugins/vite-vue';
 export default function configArcoStyleImportPlugin() {
   // 按需加载主题样式
   const arcoResolverPlugin = vitePluginForArco({
-    theme: '@arco-themes/vue-ms-theme',
+    theme: '@arco-themes/vue-ms-theme-default',
   });
-  // const arcoResolverPlugin = vitePluginForArco({});
   return arcoResolverPlugin;
 }
diff --git a/frontend/package.json b/frontend/package.json
index e8ab965857..4d3bbf26d2 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -37,7 +37,7 @@
     "@7polo/kity": "2.0.8",
     "@7polo/kityminder-core": "1.4.53",
     "@arco-design/web-vue": "^2.46.0",
-    "@arco-themes/vue-ms-theme": "^0.0.1",
+    "@arco-themes/vue-ms-theme-default": "^0.0.2",
     "@form-create/arco-design": "^3.1.21",
     "@vueuse/core": "^9.13.0",
     "ace-builds": "^1.21.1",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index ee6e4fa1e1..ffc0c2bc6d 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -15,9 +15,9 @@ dependencies:
   '@arco-design/web-vue':
     specifier: ^2.46.0
     version: 2.46.0(vue@3.3.2)
-  '@arco-themes/vue-ms-theme':
-    specifier: ^0.0.1
-    version: 0.0.1(@arco-design/web-vue@2.46.0)
+  '@arco-themes/vue-ms-theme-default':
+    specifier: ^0.0.2
+    version: 0.0.2(@arco-design/web-vue@2.46.0)
   '@form-create/arco-design':
     specifier: ^3.1.21
     version: 3.1.21(vue@3.3.2)
@@ -339,8 +339,8 @@ packages:
       - supports-color
     dev: true
 
-  /@arco-themes/vue-ms-theme@0.0.1(@arco-design/web-vue@2.46.0):
-    resolution: {integrity: sha512-UUCflcjVtIgowMT9Hlzv/TD8LJzMqFfDfvohWkzwQLOUQJjbNdwoCnSCezdWEiFkV+IZfuJtABC7KbWIeug4eA==}
+  /@arco-themes/vue-ms-theme-default@0.0.2(@arco-design/web-vue@2.46.0):
+    resolution: {integrity: sha512-Cn+okkovXHAMMrDcaXKdG2LyL4EieRs3HySTEC1C5gHQyENgfFBPXWalNz5HfzlAMSZdKuzaq7/N7nRCkGvIvA==}
     peerDependencies:
       '@arco-design/web-vue': ^2.46.0
     dependencies:
@@ -9704,12 +9704,12 @@ packages:
       jest-worker: 27.5.1
       schema-utils: 3.1.2
       serialize-javascript: 6.0.1
-      terser: 5.17.5
+      terser: 5.17.6
       webpack: 5.83.1
     dev: true
 
-  /terser@5.17.5:
-    resolution: {integrity: sha512-NqFkzBX34WExkCbk3K5urmNCpEWqMPZnwGI1pMHwqvJ/zDlXC75u3NI7BrzoR8/pryy8Abx2e1i8ChrWkhH1Hg==}
+  /terser@5.17.6:
+    resolution: {integrity: sha512-V8QHcs8YuyLkLHsJO5ucyff1ykrLVsR4dNnS//L5Y3NiSXpbK1J+WMVUs67eI0KTxs9JtHhgEQpXQVHlHI92DQ==}
     engines: {node: '>=10'}
     hasBin: true
     dependencies:
diff --git a/frontend/src/components/navbar/index.vue b/frontend/src/components/navbar/index.vue
index 8744ea56e8..e10c3522ab 100644
--- a/frontend/src/components/navbar/index.vue
+++ b/frontend/src/components/navbar/index.vue
@@ -220,7 +220,7 @@
     justify-content: space-between;
     height: 100%;
     border-bottom: 1px solid var(--color-border);
-    background-color: var(--color-bg-2);
+    background-color: var(--color-bg-1);
   }
   .left-side {
     display: flex;
diff --git a/frontend/src/layout/default-layout.vue b/frontend/src/layout/default-layout.vue
index abf2e73901..76f39627e2 100644
--- a/frontend/src/layout/default-layout.vue
+++ b/frontend/src/layout/default-layout.vue
@@ -149,11 +149,25 @@
       ::-webkit-scrollbar-thumb {
         border: 4px solid transparent;
         border-radius: 7px;
-        background-color: var(--color-text-4);
+        background-color: var(--color-bg-6);
         background-clip: padding-box;
       }
       ::-webkit-scrollbar-thumb:hover {
-        background-color: var(--color-text-3);
+        background-color: var(--color-bg-6);
+      }
+    }
+    :deep(.arco-menu-light) {
+      background-color: var(--color-bg-1) !important;
+      .arco-menu-item {
+        :hover {
+          background-color: var(--color-bg-6);
+        }
+        .arco-menu-selected {
+          background-color: var(--color-bg-6);
+          :hover {
+            background-color: var(--color-bg-6);
+          }
+        }
       }
     }
   }
diff --git a/frontend/src/store/modules/app/index.ts b/frontend/src/store/modules/app/index.ts
index d988f3e266..a561143286 100644
--- a/frontend/src/store/modules/app/index.ts
+++ b/frontend/src/store/modules/app/index.ts
@@ -4,7 +4,7 @@ import type { NotificationReturn } from '@arco-design/web-vue/es/notification/in
 import type { RouteRecordNormalized } from 'vue-router';
 import defaultSettings from '@/config/settings.json';
 import { getMenuList } from '@/api/modules/user';
-import { AppState, CustomTheme } from './types';
+import { AppState } from './types';
 
 const useAppStore = defineStore('app', {
   state: (): AppState => ({ ...defaultSettings }),