diff --git a/src/tabbar-item/index.less b/src/tabbar-item/index.less
index 2dd1fcd53..53ab3a67e 100644
--- a/src/tabbar-item/index.less
+++ b/src/tabbar-item/index.less
@@ -7,7 +7,7 @@
   --van-tabbar-item-active-background-color: @tabbar-item-active-background-color;
   --van-tabbar-item-line-height: @tabbar-item-line-height;
   --van-tabbar-item-icon-size: @tabbar-item-icon-size;
-  --van-tabbar-item-margin-bottom: @tabbar-item-margin-bottom;
+  --van-tabbar-item-icon-margin-bottom: @tabbar-item-icon-margin-bottom;
 }
 
 .van-tabbar-item {
@@ -22,13 +22,17 @@
   cursor: pointer;
 
   &__icon {
-    margin-bottom: var(--van-tabbar-item-margin-bottom);
+    margin-bottom: var(--van-tabbar-item-icon-margin-bottom);
     font-size: var(--van-tabbar-item-icon-size);
 
     .van-icon {
       display: block;
     }
 
+    .van-badge {
+      margin-top: var(--van-padding-base);
+    }
+
     img {
       display: block;
       height: 20px;
@@ -39,8 +43,4 @@
     color: var(--van-tabbar-item-active-color);
     background-color: var(--van-tabbar-item-active-background-color);
   }
-
-  .van-badge {
-    margin-top: var(--van-padding-base);
-  }
 }
diff --git a/src/tabbar-item/var.less b/src/tabbar-item/var.less
index 0e2387e3d..98103dbcb 100644
--- a/src/tabbar-item/var.less
+++ b/src/tabbar-item/var.less
@@ -6,4 +6,4 @@
 @tabbar-item-active-background-color: var(--van-white);
 @tabbar-item-line-height: 1;
 @tabbar-item-icon-size: 22px;
-@tabbar-item-margin-bottom: 4px;
+@tabbar-item-icon-margin-bottom: var(--van-padding-base);
diff --git a/src/tabbar/README.md b/src/tabbar/README.md
index 54287d1b3..7156f42ef 100644
--- a/src/tabbar/README.md
+++ b/src/tabbar/README.md
@@ -215,4 +215,4 @@ The component provides the following CSS variables, which can be used to customi
 | --van-tabbar-item-active-background-color | _var(--van-white)_ | - |
 | --van-tabbar-item-line-height | _1_ | - |
 | --van-tabbar-item-icon-size | _22px_ | - |
-| --van-tabbar-item-margin-bottom | _4px_ | - |
+| --van-tabbar-item-icon-margin-bottom | _var(--van-padding-base)_ | - |
diff --git a/src/tabbar/README.zh-CN.md b/src/tabbar/README.zh-CN.md
index 31336fd4e..1f789d1b9 100644
--- a/src/tabbar/README.zh-CN.md
+++ b/src/tabbar/README.zh-CN.md
@@ -227,4 +227,4 @@ export default {
 | --van-tabbar-item-active-background-color | _var(--van-white)_ | - |
 | --van-tabbar-item-line-height | _1_ | - |
 | --van-tabbar-item-icon-size | _22px_ | - |
-| --van-tabbar-item-margin-bottom | _4px_ | - |
+| --van-tabbar-item-icon-margin-bottom | _var(--van-padding-base)_ | - |