diff --git a/ui/src/stores/modules/user.ts b/ui/src/stores/modules/user.ts
index cbe6e208a..21db8d6c3 100644
--- a/ui/src/stores/modules/user.ts
+++ b/ui/src/stores/modules/user.ts
@@ -92,8 +92,7 @@ const useUserStore = defineStore({
 
     async theme() {
       return await ThemeApi.getThemeInfo().then((ok) => {
-        this.themeInfo = ok.data
-        changeTheme(this.themeInfo['theme'])
+        this.setTheme(ok.data)
         window.document.title = this.themeInfo['title'] || 'MaxKB'
         const link = document.querySelector('link[rel="icon"]') as any
         if (link) {
@@ -103,9 +102,9 @@ const useUserStore = defineStore({
     },
 
     async profile() {
-      return UserApi.profile().then((ok) => {
+      return UserApi.profile().then(async (ok) => {
         this.userInfo = ok.data
-        this.theme()
+        await this.theme()
         return this.asyncGetProfile()
       })
     },
diff --git a/ui/src/views/theme/index.vue b/ui/src/views/theme/index.vue
index f7d9cac3d..d383179fa 100644
--- a/ui/src/views/theme/index.vue
+++ b/ui/src/views/theme/index.vue
@@ -131,7 +131,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, onMounted, computed, watch } from 'vue'
+import { ref, reactive, onMounted, computed, watch, nextTick } from 'vue'
 import { onBeforeRouteLeave } from 'vue-router'
 import type { FormInstance, FormRules, UploadFiles } from 'element-plus'
 import { cloneDeep } from 'lodash'