diff --git a/packages/theme-saas/src/tag/index.less b/packages/theme-saas/src/tag/index.less
index ac115c35c..5f5dead63 100644
--- a/packages/theme-saas/src/tag/index.less
+++ b/packages/theme-saas/src/tag/index.less
@@ -18,6 +18,7 @@
   @apply align-middle;
   @apply overflow-hidden;
   @apply text-ellipsis;
+  @apply align-bottom;
 
   .tag-variant(
     theme('colors.color.info.primary.DEFAULT'),
diff --git a/packages/vue/src/tag/src/mobile-first.vue b/packages/vue/src/tag/src/mobile-first.vue
index 4c50963a7..44566b3c1 100644
--- a/packages/vue/src/tag/src/mobile-first.vue
+++ b/packages/vue/src/tag/src/mobile-first.vue
@@ -53,7 +53,7 @@ export default defineComponent({
     const operable = selectable ? false : this.operable
 
     const classes = m(
-      'text-xs inline-flex items-center rounded box-border border-0.5 sm:border mr-1',
+      'text-xs inline-flex items-center rounded box-border border-0.5 sm:border mr-1 align-bottom',
       effect === 'plain' || hit ? gcls(`${type}-border`) : 'border-transparent',
       gcls(`${effect}-${type}`),
       gcls(size),
@@ -70,6 +70,7 @@ export default defineComponent({
       styles.maxWidth = maxWidth
       styles.display = 'inline-block'
     }
+
     const tagElement =
       value || (slots.default && slots.default()) ? (
         <span data-tag="tiny-tag" class={classes} style={styles} onClick={handleClick}>