diff --git a/apps/client/app.config.ts b/apps/client/app.config.ts
index ee48e952..5f72e37a 100644
--- a/apps/client/app.config.ts
+++ b/apps/client/app.config.ts
@@ -4,5 +4,12 @@ export default defineAppConfig({
   ui: {
     primary: "purple",
     gray: "cool",
+    modal: {
+      container: "items-center",
+      overlay: {
+        background: "bg-black/75 dark:bg-black/75",
+      },
+      background: "dark:bg-gray-800",
+    },
   },
 });
diff --git a/apps/client/components/common/Dialog.vue b/apps/client/components/common/Dialog.vue
index 8c4f5625..d4b8a7ae 100644
--- a/apps/client/components/common/Dialog.vue
+++ b/apps/client/components/common/Dialog.vue
@@ -42,15 +42,7 @@ async function onConfirm() {
 </script>
 
 <template>
-  <UModal
-    :ui="{
-      container: 'items-center',
-      overlay: {
-        background: 'bg-black/75 dark:bg-black/75',
-      },
-      background: 'dark:bg-gray-800',
-    }"
-  >
+  <UModal>
     <div class="flex h-52 flex-col justify-between p-6 text-gray-900 dark:text-white">
       <h2 class="mb-8 text-2xl font-bold">{{ title }}</h2>
       <p class="mb-8 max-w-sm text-base text-gray-700 dark:text-gray-300">
diff --git a/apps/client/components/main/GamePauseModal.vue b/apps/client/components/main/GamePauseModal.vue
index 9e8c2a10..6fa1b41b 100644
--- a/apps/client/components/main/GamePauseModal.vue
+++ b/apps/client/components/main/GamePauseModal.vue
@@ -2,13 +2,6 @@
   <UModal
     v-model="showGamePauseModal"
     @close="handleClose"
-    :ui="{
-      container: 'items-center',
-      overlay: {
-        background: 'bg-black/75 dark:bg-black/75',
-      },
-      background: 'dark:bg-gray-800',
-    }"
   >
     <div class="flex h-52 flex-col justify-between p-6 text-gray-900 dark:text-white">
       <h2 class="mb-8 text-2xl font-bold">游戏暂停</h2>