diff --git a/apps/web-antd/src/views/ai/chat/index/components/message/MessageKnowledge.vue b/apps/web-antd/src/views/ai/chat/index/components/message/MessageKnowledge.vue
index 23b81ce47..1b9c10b77 100644
--- a/apps/web-antd/src/views/ai/chat/index/components/message/MessageKnowledge.vue
+++ b/apps/web-antd/src/views/ai/chat/index/components/message/MessageKnowledge.vue
@@ -66,7 +66,7 @@ function handleClick(doc: any) {
       <div
         v-for="(doc, index) in documentList"
         :key="index"
-        class="cursor-pointer rounded-lg bg-white p-2 px-3 transition-all hover:bg-blue-50"
+        class="bg-card cursor-pointer rounded-lg p-2 px-3 transition-all hover:bg-blue-50"
         @click="handleClick(doc)"
       >
         <div class="mb-1 text-sm text-gray-600">
@@ -89,7 +89,7 @@ function handleClick(doc: any) {
           class="border-b-solid border-b-gray-200 p-3 last:border-b-0"
         >
           <div
-            class="mb-2 block w-fit rounded-sm bg-gray-50 px-2 py-1 text-xs text-gray-400"
+            class="mb-2 block w-fit rounded-sm px-2 py-1 text-xs text-gray-400"
           >
             分段 {{ segment.id }}
           </div>
diff --git a/apps/web-antd/src/views/ai/image/index/components/ImageList.vue b/apps/web-antd/src/views/ai/image/index/components/ImageList.vue
index 95ccbe729..3daa16865 100644
--- a/apps/web-antd/src/views/ai/image/index/components/ImageList.vue
+++ b/apps/web-antd/src/views/ai/image/index/components/ImageList.vue
@@ -204,7 +204,7 @@ onUnmounted(async () => {
     </div>
 
     <div
-      class="sticky bottom-0 z-50 flex h-16 items-center justify-center bg-white shadow-sm"
+      class="bg-card sticky bottom-0 z-50 flex h-16 items-center justify-center shadow-sm"
     >
       <Pagination
         :total="pageTotal"
diff --git a/apps/web-antd/src/views/ai/image/index/components/dall3/index.vue b/apps/web-antd/src/views/ai/image/index/components/dall3/index.vue
index f3354bd19..4c59c08a3 100644
--- a/apps/web-antd/src/views/ai/image/index/components/dall3/index.vue
+++ b/apps/web-antd/src/views/ai/image/index/components/dall3/index.vue
@@ -231,7 +231,7 @@ defineExpose({ settingValues });
         @click="handleSizeClick(imageSize)"
       >
         <div
-          class="flex h-12 w-12 flex-col items-center justify-center rounded-lg border bg-white p-0"
+          class="bg-card flex h-12 w-12 flex-col items-center justify-center rounded-lg border p-0"
           :class="[
             selectSize === imageSize.key ? 'border-blue-500' : 'border-white',
           ]"
diff --git a/apps/web-antd/src/views/ai/image/index/components/midjourney/index.vue b/apps/web-antd/src/views/ai/image/index/components/midjourney/index.vue
index 0e565a6dd..d50c7ba4c 100644
--- a/apps/web-antd/src/views/ai/image/index/components/midjourney/index.vue
+++ b/apps/web-antd/src/views/ai/image/index/components/midjourney/index.vue
@@ -182,7 +182,7 @@ defineExpose({ settingValues });
         @click="handleSizeClick(imageSize)"
       >
         <div
-          class="flex h-12 w-12 items-center justify-center rounded-lg border bg-white p-0"
+          class="bg-card flex h-12 w-12 items-center justify-center rounded-lg border p-0"
           :class="[
             selectSize === imageSize.key ? 'border-blue-500' : 'border-white',
           ]"
diff --git a/apps/web-antd/src/views/ai/image/index/index.vue b/apps/web-antd/src/views/ai/image/index/index.vue
index bc7ab901a..0d8203cb8 100644
--- a/apps/web-antd/src/views/ai/image/index/index.vue
+++ b/apps/web-antd/src/views/ai/image/index/index.vue
@@ -90,13 +90,12 @@ onMounted(async () => {
 
 <template>
   <Page auto-content-height>
-    <div class="absolute inset-0 flex h-full w-full flex-row bg-gray-50">
+    <div class="bg-card absolute inset-0 flex h-full w-full flex-row">
       <div class="left-0 flex w-96 flex-col p-4">
         <div class="segmented flex justify-center">
           <Segmented
             v-model:value="selectPlatform"
             :options="platformOptions"
-            class="bg-gray-100"
           />
         </div>
         <div class="mt-8 h-full overflow-y-auto">
@@ -126,7 +125,7 @@ onMounted(async () => {
           />
         </div>
       </div>
-      <div class="ml-4 flex-1 bg-white">
+      <div class="bg-card ml-4 flex-1">
         <ImageList ref="imageListRef" @on-regeneration="handleRegeneration" />
       </div>
     </div>
diff --git a/apps/web-antd/src/views/ai/image/square/index.vue b/apps/web-antd/src/views/ai/image/square/index.vue
index d92fb65c5..24b9af530 100644
--- a/apps/web-antd/src/views/ai/image/square/index.vue
+++ b/apps/web-antd/src/views/ai/image/square/index.vue
@@ -45,7 +45,7 @@ onMounted(async () => {
 </script>
 <template>
   <Page auto-content-height>
-    <div class="bg-white p-5">
+    <div class="bg-card p-5">
       <Input.Search
         v-model="queryParams.prompt"
         class="mb-5 w-full"
@@ -54,12 +54,12 @@ onMounted(async () => {
         @keyup.enter="handleQuery"
       />
       <div
-        class="grid grid-cols-[repeat(auto-fill,minmax(200px,1fr))] gap-2.5 bg-white shadow-sm"
+        class="bg-card grid grid-cols-[repeat(auto-fill,minmax(200px,1fr))] gap-2.5 shadow-sm"
       >
         <div
           v-for="item in list"
           :key="item.id"
-          class="relative cursor-pointer overflow-hidden bg-white transition-transform duration-300 hover:scale-105"
+          class="bg-card relative cursor-pointer overflow-hidden transition-transform duration-300 hover:scale-105"
         >
           <Image
             :src="item.picUrl"
diff --git a/apps/web-antd/src/views/ai/knowledge/document/form/SplitStep.vue b/apps/web-antd/src/views/ai/knowledge/document/form/SplitStep.vue
index 15ea0b33e..ae18c5699 100644
--- a/apps/web-antd/src/views/ai/knowledge/document/form/SplitStep.vue
+++ b/apps/web-antd/src/views/ai/knowledge/document/form/SplitStep.vue
@@ -237,7 +237,7 @@ onMounted(async () => {
         <div v-else class="text-gray-400">暂无上传文件</div>
       </div>
       <!-- 文件内容预览 -->
-      <div class="max-h-[600px] overflow-y-auto rounded-md bg-gray-50 p-4">
+      <div class="max-h-[600px] overflow-y-auto rounded-md p-4">
         <div v-if="splitLoading" class="flex items-center justify-center py-5">
           <IconifyIcon icon="lucide:loader" class="is-loading" />
           <span class="ml-2.5">正在加载分段内容...</span>
@@ -258,7 +258,7 @@ onMounted(async () => {
               分片-{{ index + 1 }} · {{ segment.contentLength || 0 }} 字符数 ·
               {{ segment.tokens || 0 }} Token
             </div>
-            <div class="rounded-md bg-white p-2">
+            <div class="bg-card rounded-md p-2">
               {{ segment.content }}
             </div>
           </div>
diff --git a/apps/web-antd/src/views/ai/knowledge/document/form/index.vue b/apps/web-antd/src/views/ai/knowledge/document/form/index.vue
index 19eb88ecf..d0dc83ca5 100644
--- a/apps/web-antd/src/views/ai/knowledge/document/form/index.vue
+++ b/apps/web-antd/src/views/ai/knowledge/document/form/index.vue
@@ -131,7 +131,7 @@ defineExpose({
     <div class="mx-auto">
       <!-- 头部导航栏 -->
       <div
-        class="absolute left-0 right-0 top-0 z-10 flex h-12 items-center border-b bg-white px-4"
+        class="bg-card absolute left-0 right-0 top-0 z-10 flex h-12 items-center border-b px-4"
       >
         <!-- 左侧标题 -->
         <div class="flex w-48 items-center overflow-hidden">
diff --git a/apps/web-antd/src/views/ai/knowledge/segment/index.vue b/apps/web-antd/src/views/ai/knowledge/segment/index.vue
index 963728abc..b33bcbd1c 100644
--- a/apps/web-antd/src/views/ai/knowledge/segment/index.vue
+++ b/apps/web-antd/src/views/ai/knowledge/segment/index.vue
@@ -147,7 +147,7 @@ onMounted(() => {
       </template>
       <template #expand_content="{ row }">
         <div
-          class="whitespace-pre-wrap border-l-4 border-blue-500 bg-gray-100 px-2.5 py-5 leading-5"
+          class="whitespace-pre-wrap border-l-4 border-blue-500 px-2.5 py-5 leading-5"
         >
           <div class="mb-2 text-sm font-bold text-gray-600">完整内容：</div>
           {{ row.content }}
diff --git a/apps/web-antd/src/views/ai/mindmap/index/modules/Left.vue b/apps/web-antd/src/views/ai/mindmap/index/modules/Left.vue
index c3cc28149..a7e33828c 100644
--- a/apps/web-antd/src/views/ai/mindmap/index/modules/Left.vue
+++ b/apps/web-antd/src/views/ai/mindmap/index/modules/Left.vue
@@ -23,7 +23,7 @@ defineExpose({
 });
 </script>
 <template>
-  <div class="flex w-80 flex-col bg-gray-50 p-5">
+  <div class="bg-card flex w-80 flex-col rounded-lg p-5">
     <h3 class="text-primary h-7 w-full text-center text-xl leading-7">
       思维导图创作中心
     </h3>
diff --git a/apps/web-antd/src/views/ai/music/index/list/audioBar/index.vue b/apps/web-antd/src/views/ai/music/index/list/audioBar/index.vue
index 3fced3605..3a2b7df9a 100644
--- a/apps/web-antd/src/views/ai/music/index/list/audioBar/index.vue
+++ b/apps/web-antd/src/views/ai/music/index/list/audioBar/index.vue
@@ -40,7 +40,7 @@ function audioTimeUpdate(args: any) {
 
 <template>
   <div
-    class="b-1 b-l-none h-18 flex items-center justify-between border border-solid border-rose-100 bg-white px-2"
+    class="b-1 b-l-none h-18 bg-card flex items-center justify-between border border-solid border-rose-100 px-2"
   >
     <!-- 歌曲信息 -->
     <div class="flex gap-2.5">