diff --git a/packages/materials/src/libs/page-tab/chrome-tab-bg.vue b/packages/materials/src/libs/page-tab/chrome-tab-bg.vue
index ab1f5a23..6aac454a 100644
--- a/packages/materials/src/libs/page-tab/chrome-tab-bg.vue
+++ b/packages/materials/src/libs/page-tab/chrome-tab-bg.vue
@@ -5,7 +5,7 @@ defineOptions({
 </script>
 
 <template>
-  <svg class="wh-full">
+  <svg class="size-full">
     <defs>
       <symbol id="geometry-left" viewBox="0 0 214 36">
         <path d="M17 0h197v36H0v-2c4.5 0 9-3.5 9-8V8c0-4.5 3.5-8 8-8z"></path>
diff --git a/packages/uno-preset/src/index.ts b/packages/uno-preset/src/index.ts
index 3c744f6d..2700c1c0 100644
--- a/packages/uno-preset/src/index.ts
+++ b/packages/uno-preset/src/index.ts
@@ -7,9 +7,6 @@ export function presetSoybeanAdmin(): Preset<Theme> {
   const preset: Preset<Theme> = {
     name: 'preset-soybean-admin',
     shortcuts: [
-      {
-        'wh-full': 'w-full h-full'
-      },
       {
         'flex-center': 'flex justify-center items-center',
         'flex-x-center': 'flex justify-center',
@@ -33,7 +30,7 @@ export function presetSoybeanAdmin(): Preset<Theme> {
         'absolute-tr': 'absolute-rt',
         'absolute-bl': 'absolute-lb',
         'absolute-br': 'absolute-rb',
-        'absolute-center': 'absolute-lt flex-center wh-full',
+        'absolute-center': 'absolute-lt flex-center size-full',
         'fixed-lt': 'fixed left-0 top-0',
         'fixed-lb': 'fixed left-0 bottom-0',
         'fixed-rt': 'fixed right-0 top-0',
@@ -42,7 +39,7 @@ export function presetSoybeanAdmin(): Preset<Theme> {
         'fixed-tr': 'fixed-rt',
         'fixed-bl': 'fixed-lb',
         'fixed-br': 'fixed-rb',
-        'fixed-center': 'fixed-lt flex-center wh-full'
+        'fixed-center': 'fixed-lt flex-center size-full'
       },
       {
         'nowrap-hidden': 'overflow-hidden whitespace-nowrap',
diff --git a/src/components/common/exception-base.vue b/src/components/common/exception-base.vue
index cc2f7068..7c6779f2 100644
--- a/src/components/common/exception-base.vue
+++ b/src/components/common/exception-base.vue
@@ -29,7 +29,7 @@ const icon = computed(() => iconMap[props.type]);
 </script>
 
 <template>
-  <div class="flex-vertical-center gap-24px min-h-520px wh-full overflow-hidden">
+  <div class="flex-vertical-center gap-24px min-h-520px size-full overflow-hidden">
     <div class="flex text-400px text-primary">
       <SvgIcon :local-icon="icon" />
     </div>
diff --git a/src/components/custom/look-forward.vue b/src/components/custom/look-forward.vue
index 085129d2..c00a3617 100644
--- a/src/components/custom/look-forward.vue
+++ b/src/components/custom/look-forward.vue
@@ -7,7 +7,7 @@ defineOptions({
 </script>
 
 <template>
-  <div class="flex-vertical-center gap-24px min-h-520px wh-full overflow-hidden">
+  <div class="flex-vertical-center gap-24px min-h-520px size-full overflow-hidden">
     <div class="flex text-400px text-primary">
       <SvgIcon local-icon="expectation" />
     </div>
diff --git a/src/components/custom/wave-bg.vue b/src/components/custom/wave-bg.vue
index 2a6ef54c..72cb04aa 100644
--- a/src/components/custom/wave-bg.vue
+++ b/src/components/custom/wave-bg.vue
@@ -16,7 +16,7 @@ const darkColor = computed(() => getColorPalette(props.themeColor, 6));
 </script>
 
 <template>
-  <div class="absolute-lt z-1 wh-full overflow-hidden">
+  <div class="absolute-lt z-1 size-full overflow-hidden">
     <div class="absolute -right-300px -top-900px <sm:(-right-100px -top-1170px)">
       <svg height="1337" width="1337">
         <defs>
diff --git a/src/layouts/modules/global-sider/index.vue b/src/layouts/modules/global-sider/index.vue
index ce242d83..71591921 100644
--- a/src/layouts/modules/global-sider/index.vue
+++ b/src/layouts/modules/global-sider/index.vue
@@ -23,7 +23,7 @@ const showLogo = computed(() => !isVerticalMix.value && !isHorizontalMix.value);
 </script>
 
 <template>
-  <DarkModeContainer class="flex-vertical-stretch wh-full shadow-sider" :inverted="darkMenu">
+  <DarkModeContainer class="flex-vertical-stretch size-full shadow-sider" :inverted="darkMenu">
     <GlobalLogo
       v-if="showLogo"
       :show-title="!appStore.siderCollapse"
diff --git a/src/layouts/modules/global-tab/index.vue b/src/layouts/modules/global-tab/index.vue
index bf00ffa3..8e929d0e 100644
--- a/src/layouts/modules/global-tab/index.vue
+++ b/src/layouts/modules/global-tab/index.vue
@@ -159,7 +159,7 @@ init();
 </script>
 
 <template>
-  <DarkModeContainer class="flex-y-center wh-full px-16px shadow-tab">
+  <DarkModeContainer class="flex-y-center size-full px-16px shadow-tab">
     <div ref="bsWrapper" class="flex-1-hidden h-full">
       <BetterScroll ref="bsScroll" :options="{ scrollX: true, scrollY: false, click: appStore.isMobile }">
         <div
diff --git a/src/views/_builtin/login/index.vue b/src/views/_builtin/login/index.vue
index 4735a25e..bb622887 100644
--- a/src/views/_builtin/login/index.vue
+++ b/src/views/_builtin/login/index.vue
@@ -57,7 +57,7 @@ const bgColor = computed(() => {
 </script>
 
 <template>
-  <div class="relative flex-center wh-full overflow-hidden" :style="{ backgroundColor: bgColor }">
+  <div class="relative flex-center size-full overflow-hidden" :style="{ backgroundColor: bgColor }">
     <WaveBg :theme-color="bgThemeColor" />
     <NCard :bordered="false" class="relative w-auto rd-12px z-4">
       <div class="w-400px <sm:w-300px">