diff --git a/public/docset/ui/wc-badge.md b/public/docset/ui/wc-badge.md
new file mode 100644
index 0000000..8b5a098
--- /dev/null
+++ b/public/docset/ui/wc-badge.md
@@ -0,0 +1,148 @@
+## WC-BADGE
+> 按钮和图标上的数字或状态标记。
+
+
+
+### 基础用法
+可以用来展示新消息的数量。
+
+数量值可接受 Number 或 String。
+
+
+
+
+
+import '//jscdn.ink/@bd/ui/latest/space/index.js'
+import '//jscdn.ink/@bd/ui/latest/badge/index.js'
+import '//jscdn.ink/@bd/ui/latest/form/button.js'
+ document.querySelectorAll('wc-badge').forEach(item=>{
+ item.addEventListener('click',function(e){
+ this.value++
+ })
+ })
+
+
+
+
+ primary
+
+
+ info
+
+
+ success
+
+
+
+
+ help
+ secondary
+
+ warning
+
+
+
+
+ wc-badge{
+ margin-right:15px;
+ }
+
+
+
+
+
+
+
+
+
+### 最大值
+你还可以自定义最大值
+
+由 max 属性定义，接受 Number 值。 请注意，仅在值也是 Number 时起作用。
+
+
+import '//jscdn.ink/@bd/ui/latest/space/index.js'
+import '//jscdn.ink/@bd/ui/latest/badge/index.js'
+import '//jscdn.ink/@bd/ui/latest/form/button.js'
+
+
+
+
+ info
+
+ info
+
+
+
+ wc-badge{
+ margin-right:15px;
+ }
+
+
+
+
+### 自定义显示内容
+当 value 是 `String` 时，可以显示自定义文字。
+
+
+
+import '//jscdn.ink/@bd/ui/latest/space/index.js'
+import '//jscdn.ink/@bd/ui/latest/badge/index.js'
+import '//jscdn.ink/@bd/ui/latest/form/button.js'
+
+
+
+
+ comments
+
+ replies
+
+
+
+
+
+
+
+ wc-badge{
+ margin-right:20px;
+ }
+
+
+
+### 小红点
+通过一个小红点标记来告知用户有新内容。
+
+使用 `is-dot` 属性。 是个布尔值。
+
+
+import '//jscdn.ink/@bd/ui/latest/space/index.js'
+import '//jscdn.ink/@bd/ui/latest/badge/index.js'
+import '//jscdn.ink/@bd/ui/latest/form/button.js'
+
+
+
+ query
+ visits
+
+
+
+
+ wc-badge{ margin-right:20px; }
+
+
+
+
+
+
+
+
+### 完整APIs
+
+| 属性 | 值类型 | 默认值 | 描述 |
+| :-: | :-: | :-: | - |
+| value | String | 无 | 标记绑定值 |
+| type | String | 无 | 标记类型, 仅能决定标记的颜色, 无额外作用, 可选值有: `primary、info、success、warning、default、secondary、danger` |
+| max | Number | 无 | 最大值，超过最大值会显示 {max}+。 只有当 value 是数字类型时起作用。 |
+| hidden | Boolean | false | 为`true`时隐藏标记 |
+| is-dot | Boolean | false | 是否开启小圆点模式 |
+