diff --git a/dashboard/src/layouts/full/vertical-header/VerticalHeader.vue b/dashboard/src/layouts/full/vertical-header/VerticalHeader.vue
index 964a08b6e..ba9d3ef23 100644
--- a/dashboard/src/layouts/full/vertical-header/VerticalHeader.vue
+++ b/dashboard/src/layouts/full/vertical-header/VerticalHeader.vue
@@ -213,11 +213,19 @@ if (localStorage.getItem('change_pwd_hint') != null && localStorage.getItem('cha
 <template>
   <v-app-bar elevation="0" height="55">
 
-    <v-btn style="margin-left: 22px;" class="hidden-md-and-down text-secondary" color="lightsecondary" icon rounded="sm"
+    <v-btn v-if="useCustomizerStore().uiTheme==='PurpleTheme'" style="margin-left: 22px;" class="hidden-md-and-down text-secondary" color="lightsecondary" icon rounded="sm"
            variant="flat" @click.stop="customizer.SET_MINI_SIDEBAR(!customizer.mini_sidebar)" size="small">
       <v-icon>mdi-menu</v-icon>
     </v-btn>
-    <v-btn class="hidden-lg-and-up text-secondary ms-3" color="lightsecondary" icon rounded="sm" variant="flat"
+    <v-btn v-else style="margin-left: 22px; color: var(--v-theme-primaryText); background-color: var(--v-theme-secondary)" class="hidden-md-and-down" icon rounded="sm"
+           variant="flat" @click.stop="customizer.SET_MINI_SIDEBAR(!customizer.mini_sidebar)" size="small">
+      <v-icon>mdi-menu</v-icon>
+    </v-btn>
+    <v-btn v-if="useCustomizerStore().uiTheme==='PurpleTheme'" class="hidden-lg-and-up text-secondary ms-3" color="lightsecondary" icon rounded="sm" variant="flat"
+           @click.stop="customizer.SET_SIDEBAR_DRAWER" size="small">
+      <v-icon>mdi-menu</v-icon>
+    </v-btn>
+    <v-btn v-else class="hidden-lg-and-up ms-3" icon rounded="sm" variant="flat"
            @click.stop="customizer.SET_SIDEBAR_DRAWER" size="small">
       <v-icon>mdi-menu</v-icon>
     </v-btn>
@@ -225,7 +233,7 @@ if (localStorage.getItem('change_pwd_hint') != null && localStorage.getItem('cha
     <div style="margin-left: 16px; display: flex; align-items: center; gap: 8px;">
       <span style=" font-size: 24px; font-weight: 1000;">Astr<span style="font-weight: normal;">Bot</span>
       </span>
-      <span style="font-size: 12px; color: color(var(--v-theme-secondaryText));">{{ botCurrVersion }}</span>
+      <span style="font-size: 12px; color: var(--v-theme-secondaryText);">{{ botCurrVersion }}</span>
     </div>
 
     <v-spacer/>
@@ -239,7 +247,7 @@ if (localStorage.getItem('change_pwd_hint') != null && localStorage.getItem('cha
       </small>
     </div>
 
-    <v-btn size="small" @click="toggleDarkMode();" class="text-primary mr-2" color="color(var(--v-theme-surface))"
+    <v-btn size="small" @click="toggleDarkMode();" class="text-primary mr-2" color="var(--v-theme-surface)"
            variant="flat" rounded="sm">
       <!-- 明暗主题切换按钮 -->
       <v-icon>mdi-lightbulb-night-outline</v-icon>
@@ -248,7 +256,7 @@ if (localStorage.getItem('change_pwd_hint') != null && localStorage.getItem('cha
     <v-dialog v-model="updateStatusDialog" width="1000">
       <template v-slot:activator="{ props }">
         <v-btn size="small" @click="checkUpdate(); getReleases(); getDevCommits();" class="text-primary mr-2"
-               color="color(var(--v-theme-surface))"
+               color="var(--v-theme-surface)"
                variant="flat" rounded="sm" v-bind="props">
           更新
         </v-btn>
@@ -382,7 +390,7 @@ if (localStorage.getItem('change_pwd_hint') != null && localStorage.getItem('cha
 
     <v-dialog v-model="dialog" persistent width="700">
       <template v-slot:activator="{ props }">
-        <v-btn size="small" class="text-primary mr-4" color="color(var(--v-theme-surface))" variant="flat" rounded="sm" v-bind="props">
+        <v-btn size="small" class="text-primary mr-4" color="var(--v-theme-surface)" variant="flat" rounded="sm" v-bind="props">
           账户
         </v-btn>
       </template>
diff --git a/dashboard/src/views/AboutPage.vue b/dashboard/src/views/AboutPage.vue
index 40e66eb1c..0cfd3efd8 100644
--- a/dashboard/src/views/AboutPage.vue
+++ b/dashboard/src/views/AboutPage.vue
@@ -11,7 +11,7 @@
                         </div>
                         <div class="title-container">
                             <h1 class="text-h2 font-weight-bold">AstrBot</h1>
-                            <p class="text-subtitle-1" style="color: color(var(--v-theme-secondaryText));">A project out of interests and loves ❤️</p>
+                            <p class="text-subtitle-1" style="color: var(--v-theme-secondaryText);">A project out of interests and loves ❤️</p>
                             <div class="action-buttons">
                                 <v-btn @click="open('https://github.com/Soulter/AstrBot')"
                                     color="primary" variant="elevated" prepend-icon="mdi-star">
@@ -32,10 +32,10 @@
                         <v-row justify="center" align="center">
                             <v-col cols="12" md="6" class="pr-md-8 contributors-info">
                                 <h2 class="text-h4 font-weight-medium">贡献者</h2>
-                                <p class="mb-4 text-body-1" style="color: color(var(--v-theme-secondaryText));">
+                                <p class="mb-4 text-body-1" style="color: var(--v-theme-secondaryText);">
                                     本项目由众多开源社区成员共同维护。感谢每一位贡献者的付出！
                                 </p>
-                                <p class="text-body-1" style="color: color(var(--v-theme-secondaryText));">
+                                <p class="text-body-1" style="color: var(--v-theme-secondaryText);">
                                     <a href="https://github.com/Soulter/AstrBot/graphs/contributors" class="text-decoration-none custom-link">查看 AstrBot 贡献者</a>
                                 </p>
                             </v-col>
@@ -64,7 +64,7 @@
                                 
                                 <div class="license-container mt-8">
                                     <img v-bind="props" src="https://www.gnu.org/graphics/agplv3-with-text-100x42.png" style="cursor: pointer;"/>
-                                    <p class="text-caption mt-2" style="color: color(var(--v-theme-secondaryText));">AstrBot 采用 AGPL v3 协议开源</p>
+                                    <p class="text-caption mt-2" style="color: var(--v-theme-secondaryText);">AstrBot 采用 AGPL v3 协议开源</p>
                                 </div>
                             </v-col>
                             <v-col cols="12" md="6">
@@ -148,7 +148,7 @@ export default {
 }
 
 .contributors-section {
-    background-color: color(var(--v-theme-containerBg, #f9f9fb));
+    background-color: var(--v-theme-containerBg, #f9f9fb);
 }
 
 .contributors-info, .stats-info {
diff --git a/dashboard/src/views/ChatPage.vue b/dashboard/src/views/ChatPage.vue
index 0df34a8dd..30ef26259 100644
--- a/dashboard/src/views/ChatPage.vue
+++ b/dashboard/src/views/ChatPage.vue
@@ -674,7 +674,7 @@ export default {
     height: 100%;
     border-radius: 12px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
-    background-color: color(var(--v-theme-background));
+    background-color: var(--v-theme-background);
 }
 
 .chat-page-container {
@@ -697,7 +697,7 @@ export default {
     flex-direction: column;
     padding: 0;
     border-right: 1px solid rgba(0, 0, 0, 0.05);
-    background-color: color(var(--v-theme-background));
+    background-color: var(--v-theme-background);
     height: 100%;
     position: relative;
 }
@@ -720,7 +720,7 @@ export default {
 .sidebar-section-title {
     font-size: 12px;
     font-weight: 500;
-    color: color(var(--v-theme-secondaryText));
+    color: var(--v-theme-secondaryText);
     text-transform: uppercase;
     letter-spacing: 0.5px;
     margin-bottom: 12px;
@@ -778,7 +778,7 @@ export default {
 
 .timestamp {
     font-size: 11px;
-    color: color(var(--v-theme-secondaryText));
+    color: var(--v-theme-secondaryText);
     line-height: 1;
 }
 
@@ -821,7 +821,7 @@ export default {
 
 .no-conversations-text {
     font-size: 14px;
-    color: color(var(--v-theme-secondaryText));
+    color: var(--v-theme-secondaryText);
 }
 
 /* 聊天内容区域 */
@@ -857,21 +857,21 @@ export default {
 .bot-name {
     font-weight: 700;
     margin-left: 8px;
-    color: color(var(--v-theme-secondary));
+    color: var(--v-theme-secondary);
 }
 
 .welcome-hint {
     margin-top: 8px;
-    color: color(var(--v-theme-secondaryText));
+    color: var(--v-theme-secondaryText);
     font-size: 14px;
 }
 
 .welcome-hint code {
-    background-color: color(var(--v-theme-codeBg));
+    background-color: var(--v-theme-codeBg);
     padding: 2px 6px;
     margin: 0 4px;
     border-radius: 4px;
-    color: #ffffffcolor(var(--v-theme-code));
+    color: var(--v-theme-code);
     font-family: 'Fira Code', monospace;
     font-size: 13px;
 }
@@ -910,15 +910,15 @@ export default {
 }
 
 .user-bubble {
-    background-color: color(var(--v-theme-background));
-    color: color(var(--v-theme-primaryText));
+    background-color: var(--v-theme-background);
+    color: var(--v-theme-primaryText);
     border-top-right-radius: 4px;
 }
 
 .bot-bubble {
-    background-color: color(var(--v-theme-surface));
+    background-color: var(--v-theme-surface);
     border: 1px solid var(--v-theme-border);
-    color: color(var(--v-theme-primaryText));
+    color: var(--v-theme-primaryText);
     border-top-left-radius: 4px;
 }
 
@@ -965,7 +965,7 @@ export default {
 /* 输入区域样式 */
 .input-area {
     padding: 16px;
-    background-color: color(var(--v-theme-surface));
+    background-color: var(--v-theme-surface);
     position: relative;
     border-top: 1px solid var(--v-theme-border);
 }
@@ -1037,7 +1037,7 @@ export default {
     margin-top: 16px;
     margin-bottom: 10px;
     font-weight: 600;
-    color: color(var(--v-theme-primaryText));
+    color: var(--v-theme-primaryText);
 }
 
 .markdown-content h1 {
diff --git a/dashboard/src/views/ConsolePage.vue b/dashboard/src/views/ConsolePage.vue
index a9c4e7dee..44c44af2d 100644
--- a/dashboard/src/views/ConsolePage.vue
+++ b/dashboard/src/views/ConsolePage.vue
@@ -7,7 +7,7 @@ import axios from 'axios';
 <template>
   <div style="height: 100%;">
     <div
-      style="background-color: color(var(--v-theme-surface)); padding: 8px; padding-left: 16px; border-radius: 8px; margin-bottom: 16px; display: flex; flex-direction: row; align-items: center; justify-content: space-between;">
+      style="background-color: var(--v-theme-surface); padding: 8px; padding-left: 16px; border-radius: 8px; margin-bottom: 16px; display: flex; flex-direction: row; align-items: center; justify-content: space-between;">
       <h4>控制台</h4>
       <div class="d-flex align-center">
         <v-switch
diff --git a/dashboard/src/views/ExtensionMarketplace.vue b/dashboard/src/views/ExtensionMarketplace.vue
index 47a7de88d..0f46b775c 100644
--- a/dashboard/src/views/ExtensionMarketplace.vue
+++ b/dashboard/src/views/ExtensionMarketplace.vue
@@ -52,7 +52,7 @@ import 'highlight.js/styles/github.css';
 
                 <v-card-text>
 
-                    <small style="color: color(var(--v-theme-secondaryText, #bbb));">每个插件都是作者无偿提供的的劳动成果。如果您喜欢某个插件，请 Star！</small>
+                    <small style="color: var(--v-theme-secondaryText, #bbb);">每个插件都是作者无偿提供的的劳动成果。如果您喜欢某个插件，请 Star！</small>
                     <div v-if="pinnedPlugins.length > 0" class="mt-4">
                         <h2>🥳 推荐</h2>
 
@@ -77,7 +77,7 @@ import 'highlight.js/styles/github.css';
                                             style="height: 80px; width: 80px; margin-right: 8px; border-radius: 8px; margin-top: 8px; margin-bottom: 8px;"
                                             alt="logo">
                                         <span v-if="item?.repo"><a :href="item?.repo"
-                                                style="color: color(var(--v-theme-primaryText, #000)); text-decoration:none">{{
+                                                style="color: var(--v-theme-primaryText, #000); text-decoration:none">{{
                                                     item.name }}</a></span>
                                         <span v-else>{{ item.name }}</span>
 
diff --git a/dashboard/src/views/Settings.vue b/dashboard/src/views/Settings.vue
index 2155babfa..b7a980419 100644
--- a/dashboard/src/views/Settings.vue
+++ b/dashboard/src/views/Settings.vue
@@ -1,6 +1,6 @@
 <template>
 
-    <div style="background-color: color(var(--v-theme-surface, #fff)); padding: 8px; padding-left: 16px; border-radius: 8px; margin-bottom: 16px;">
+    <div style="background-color: var(--v-theme-surface, #fff); padding: 8px; padding-left: 16px; border-radius: 8px; margin-bottom: 16px;">
 
         <v-list lines="two">
             <v-list-subheader>网络</v-list-subheader>
diff --git a/dashboard/src/views/alkaid/KnowledgeBase.vue b/dashboard/src/views/alkaid/KnowledgeBase.vue
index 0aef3a175..6dbc97f99 100644
--- a/dashboard/src/views/alkaid/KnowledgeBase.vue
+++ b/dashboard/src/views/alkaid/KnowledgeBase.vue
@@ -597,7 +597,7 @@ export default {
     position: relative;
     cursor: pointer;
     display: flex;
-    background-color: #ffffff;
+    background-color: var(--v-theme-background);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     transition: all 0.3s ease;
 }
@@ -630,7 +630,7 @@ export default {
     display: flex;
     align-items: center;
     justify-content: center;
-    background-color: #ffffff;
+    background-color: var(--v-theme-background);
     border-radius: 50%;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
     margin-bottom: 16px;
diff --git a/dashboard/src/views/dashboards/default/DefaultDashboard.vue b/dashboard/src/views/dashboards/default/DefaultDashboard.vue
index ef76c9922..22f147f84 100644
--- a/dashboard/src/views/dashboards/default/DefaultDashboard.vue
+++ b/dashboard/src/views/dashboards/default/DefaultDashboard.vue
@@ -155,7 +155,7 @@ export default {
 <style scoped>
 .dashboard-container {
   padding: 16px;
-  background-color: color(var(--v-theme-background));
+  background-color: var(--v-theme-background);
   min-height: calc(100vh - 64px);
   border-radius: 10px;
   
@@ -170,13 +170,13 @@ export default {
 .dashboard-title {
   font-size: 24px;
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
   margin-bottom: 4px;
 }
 
 .dashboard-subtitle {
   font-size: 14px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
 }
 
 .notice-row {
@@ -194,18 +194,18 @@ export default {
 
 .plugin-card {
   border-radius: 8px;
-  background-color: color(var(--v-theme-surface));
+  background-color: var(--v-theme-surface);
 }
 
 .plugin-title {
   font-size: 18px;
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
 }
 
 .plugin-subtitle {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-top: 4px;
 }
 
@@ -225,7 +225,7 @@ export default {
 
 .plugin-version {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText, #666));
+  color: var(--v-theme-secondaryText, #666);
 }
 
 .dashboard-footer {
diff --git a/dashboard/src/views/dashboards/default/components/MessageStat.vue b/dashboard/src/views/dashboards/default/components/MessageStat.vue
index 5486412dd..3f8bdfbed 100644
--- a/dashboard/src/views/dashboards/default/components/MessageStat.vue
+++ b/dashboard/src/views/dashboards/default/components/MessageStat.vue
@@ -293,12 +293,12 @@ export default {
 .chart-title {
   font-size: 18px;
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
 }
 
 .chart-subtitle {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-top: 4px;
 }
 
@@ -315,31 +315,31 @@ export default {
 
 .stat-box {
   padding: 12px 16px;
-  background: color(var(--v-theme-surface));
+  background: var(--v-theme-surface);
   border-radius: 8px;
   flex: 1;
 }
 
 .stat-label {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-bottom: 4px;
 }
 
 .stat-number {
   font-size: 18px;
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
   display: flex;
   align-items: center;
 }
 
 .trend-up .stat-number {
-  color: color(var(--v-theme-success));
+  color: var(--v-theme-success);
 }
 
 .trend-down .stat-number {
-  color: color(var(--v-theme-error));
+  color: var(--v-theme-error);
 }
 
 .chart-container {
@@ -354,7 +354,7 @@ export default {
   left: 0;
   width: 100%;
   height: 100%;
-  background: color(var(--v-theme-overlay));
+  background: var(--v-theme-overlay);
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -365,6 +365,6 @@ export default {
 .loading-text {
   margin-top: 12px;
   font-size: 14px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
 }
 </style>
\ No newline at end of file
diff --git a/dashboard/src/views/dashboards/default/components/PlatformStat.vue b/dashboard/src/views/dashboards/default/components/PlatformStat.vue
index 2cc9c57a2..5f1d458a3 100644
--- a/dashboard/src/views/dashboards/default/components/PlatformStat.vue
+++ b/dashboard/src/views/dashboards/default/components/PlatformStat.vue
@@ -132,12 +132,12 @@ export default {
 .platform-title {
   font-size: 18px;
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
 }
 
 .platform-subtitle {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-top: 4px;
 }
 
@@ -171,16 +171,16 @@ export default {
   width: 24px;
   height: 24px;
   border-radius: 50%;
-  background-color: color(var(--v-theme-surface));
-  color: color(var(--v-theme-primaryText));
+  background-color: var(--v-theme-surface);
+  color: var(--v-theme-primaryText);
   font-weight: 600;
   font-size: 14px;
   margin-right: 12px;
 }
 
 .top-rank {
-  background-color: color(var(--v-theme-secondary));
-  color: color(var(--v-theme-surface));
+  background-color: var(--v-theme-secondary);
+  color: var(--v-theme-surface);
 }
 
 .platform-name {
@@ -195,19 +195,19 @@ export default {
 .count-value {
   font-weight: 600;
   font-size: 14px;
-  color: color(var(--v-theme-secondary));
+  color: var(--v-theme-secondary);
   margin-right: 4px;
 }
 
 .count-label {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
 }
 
 .platform-stats-summary {
   display: flex;
   justify-content: space-between;
-  background-color: color(var(--v-theme-containerBg));
+  background-color: var(--v-theme-containerBg);
   border-radius: 8px;
   padding: 12px;
   margin-bottom: 16px;
@@ -220,13 +220,13 @@ export default {
 
 .stat-label {
   font-size: 12px;
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-bottom: 4px;
 }
 
 .stat-value {
   font-weight: 600;
-  color: color(var(--v-theme-primaryText));
+  color: var(--v-theme-primaryText);
 }
 
 .platform-chart {
@@ -246,7 +246,7 @@ export default {
 }
 
 .no-data-text {
-  color: color(var(--v-theme-secondaryText));
+  color: var(--v-theme-secondaryText);
   margin-top: 16px;
   font-size: 14px;
 }