diff --git a/docs/en-US/component/badge.md b/docs/en-US/component/badge.md
index 184aa2ba71..d4032f5288 100644
--- a/docs/en-US/component/badge.md
+++ b/docs/en-US/component/badge.md
@@ -11,7 +11,7 @@ A number or status mark on buttons and icons.
 
 Displays the amount of new messages.
 
-:::demo The amount is defined with `value` which accepts `Number` or `String`.
+:::demo The amount is defined with value which accepts Number or String.
 
 badge/basic
 
@@ -21,7 +21,7 @@ badge/basic
 
 You can customize the max value.
 
-:::demo The max value is defined by property `max` which is a `Number`. Note that it only works when `value` is also a `Number`.
+:::demo The max value is defined by property max which is a Number. Note that it only works when value is also a Number.
 
 badge/max
 
@@ -31,7 +31,7 @@ badge/max
 
 Displays text content other than numbers.
 
-:::demo When `value` is a `String`, it can display customized text.
+:::demo When value is a String, it can display customized text.
 
 badge/customize
 
@@ -41,26 +41,26 @@ badge/customize
 
 Use a red dot to mark content that needs to be noticed.
 
-:::demo Use the attribute `is-dot`. It is a `Boolean`.
+:::demo Use the attribute `is-dot`. It is a Boolean.
 
 badge/dot
 
 :::
 
-## Badge API
+## API
 
-### Badge Attributes
+### Attributes
 
-| Name     | Description                                                                     | Type                                                        | Default    |
-| -------- | ------------------------------------------------------------------------------- | ----------------------------------------------------------- | ---------- |
-| `value`  | display value.                                                                  | `string \| number`                                          | `''`       |
-| `max`    | maximum value, shows `{max}+` when exceeded. Only works if `value` is a number. | `number`                                                    | `99`       |
-| `is-dot` | if a little dot is displayed.                                                   | `boolean`                                                   | `false`    |
-| `hidden` | hidden badge.                                                                   | `boolean`                                                   | `false`    |
-| `type`   | badge type.                                                                     | `'primary' \| 'success' \| 'warning' \| 'danger' \| 'info'` | `'danger'` |
+| Name   | Description                                                                   | Type                                                               | Default |
+| ------ | ----------------------------------------------------------------------------- | ------------------------------------------------------------------ | ------- |
+| value  | display value.                                                                | ^[string] / ^[number]                                              | ''      |
+| max    | maximum value, shows `{max}+` when exceeded. Only works if value is a number. | ^[number]                                                          | 99      |
+| is-dot | if a little dot is displayed.                                                 | ^[boolean]                                                         | false   |
+| hidden | hidden badge.                                                                 | ^[boolean]                                                         | false   |
+| type   | badge type.                                                                   | ^[enum]`'primary' \| 'success' \| 'warning' \| 'danger' \| 'info'` | danger  |
 
-### Badge Slots
+### Slots
 
-| Name      | Description               |
-| --------- | ------------------------- |
-| `default` | customize default content |
+| Name    | Description               |
+| ------- | ------------------------- |
+| default | customize default content |
diff --git a/packages/components/badge/index.ts b/packages/components/badge/index.ts
index 4f37c2477e..2db313a4bf 100644
--- a/packages/components/badge/index.ts
+++ b/packages/components/badge/index.ts
@@ -6,3 +6,4 @@ export const ElBadge = withInstall(Badge)
 export default ElBadge
 
 export * from './src/badge'
+export type { BadgeInstance } from './src/instance'
diff --git a/packages/components/badge/src/badge.ts b/packages/components/badge/src/badge.ts
index dc8f7f66a2..9e872e43b9 100644
--- a/packages/components/badge/src/badge.ts
+++ b/packages/components/badge/src/badge.ts
@@ -1,18 +1,32 @@
 import { buildProps } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
-import type Badge from './badge.vue'
 
 export const badgeProps = buildProps({
+  /**
+   * @description display value.
+   */
   value: {
     type: [String, Number],
     default: '',
   },
+  /**
+   * @description maximum value, shows `{max}+` when exceeded. Only works if value is a number.
+   */
   max: {
     type: Number,
     default: 99,
   },
+  /**
+   * @description if a little dot is displayed.
+   */
   isDot: Boolean,
+  /**
+   * @description hidden badge.
+   */
   hidden: Boolean,
+  /**
+   * @description badge type.
+   */
   type: {
     type: String,
     values: ['primary', 'success', 'warning', 'info', 'danger'],
@@ -20,5 +34,3 @@ export const badgeProps = buildProps({
   },
 } as const)
 export type BadgeProps = ExtractPropTypes<typeof badgeProps>
-
-export type BadgeInstance = InstanceType<typeof Badge>
diff --git a/packages/components/badge/src/instance.ts b/packages/components/badge/src/instance.ts
new file mode 100644
index 0000000000..f30d3470ca
--- /dev/null
+++ b/packages/components/badge/src/instance.ts
@@ -0,0 +1,3 @@
+import type Badge from './badge.vue'
+
+export type BadgeInstance = InstanceType<typeof Badge>