diff --git a/packages/docs/icons/svgs/fill/menu.svg b/packages/docs/icons/svgs/fill/menu.svg
new file mode 100644
index 0000000000000000000000000000000000000000..49c3c0c52ff8f4e8090d206231425f926f82946c
--- /dev/null
+++ b/packages/docs/icons/svgs/fill/menu.svg
@@ -0,0 +1,4 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <path
+    d="M8.53 12.855a2.6 2.6 0 0 1 2.6 2.6v3.568a2.6 2.6 0 0 1-2.6 2.6H4.941a2.6 2.6 0 0 1-2.6-2.6v-3.568a2.6 2.6 0 0 1 2.6-2.6zm10.722 0a2.6 2.6 0 0 1 2.6 2.6v3.568a2.6 2.6 0 0 1-2.6 2.6h-3.589a2.6 2.6 0 0 1-2.6-2.6v-3.568a2.6 2.6 0 0 1 2.6-2.6zm-10.722 1.2H4.941a1.4 1.4 0 0 0-1.4 1.4v3.568a1.4 1.4 0 0 0 1.4 1.4H8.53a1.4 1.4 0 0 0 1.4-1.4v-3.568a1.4 1.4 0 0 0-1.4-1.4zm10.722 0h-3.589a1.4 1.4 0 0 0-1.4 1.4v3.568a1.4 1.4 0 0 0 1.4 1.4h3.589a1.4 1.4 0 0 0 1.4-1.4v-3.568a1.4 1.4 0 0 0-1.4-1.4zM8.53 2.379a2.6 2.6 0 0 1 2.6 2.6v3.568a2.6 2.6 0 0 1-2.6 2.6H4.941a2.6 2.6 0 0 1-2.6-2.6V4.979a2.6 2.6 0 0 1 2.6-2.6zm10.722 0a2.6 2.6 0 0 1 2.6 2.6v3.568a2.6 2.6 0 0 1-2.6 2.6h-3.589a2.6 2.6 0 0 1-2.6-2.6V4.979a2.6 2.6 0 0 1 2.6-2.6zM8.53 3.579H4.941a1.4 1.4 0 0 0-1.4 1.4v3.568a1.4 1.4 0 0 0 1.4 1.4H8.53a1.4 1.4 0 0 0 1.4-1.4V4.979a1.4 1.4 0 0 0-1.4-1.4zm10.722 0h-3.589a1.4 1.4 0 0 0-1.4 1.4v3.568a1.4 1.4 0 0 0 1.4 1.4h3.589a1.4 1.4 0 0 0 1.4-1.4V4.979a1.4 1.4 0 0 0-1.4-1.4z" />
+</svg>
\ No newline at end of file
diff --git a/packages/opendesign/src/menu/__docs__/__case__/CustomIcon.vue b/packages/opendesign/src/menu/__docs__/__case__/CustomIcon.vue
new file mode 100644
index 0000000000000000000000000000000000000000..4203cd27807653d64bdb277844ff94917a966e20
--- /dev/null
+++ b/packages/opendesign/src/menu/__docs__/__case__/CustomIcon.vue
@@ -0,0 +1,36 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 自定义图标
+
+<!-- en-US -->
+
+### Custom Icons
+</docs>
+<script setup lang="ts">
+import { OMenu, OSubMenu, OMenuItem, OIconEdit, OIconCalendar } from '@opensig/opendesign';
+</script>
+<template>
+  <OMenu>
+    <OMenuItem value="home">
+      <template #icon><img src="/favicon.ico" alt="home" class="home-icon" /></template>
+      Home
+    </OMenuItem>
+    <OSubMenu value="edit" :icon="OIconEdit">
+      <template #title>Edit</template>
+      <OMenuItem value="undo">Undo</OMenuItem>
+      <OMenuItem value="redo">Redo</OMenuItem>
+    </OSubMenu>
+    <OSubMenu value="calendar" :icon="OIconCalendar">
+      <template #title>Calendar</template>
+      <OMenuItem value="today">Today</OMenuItem>
+      <OMenuItem value="yesterday">Yesterday</OMenuItem>
+    </OSubMenu>
+  </OMenu>
+</template>
+<style scoped lang="scss">
+.home-icon {
+  max-width: 1em;
+  max-height: 1em;
+}
+</style>
diff --git a/packages/opendesign/src/menu/__docs__/__case__/MenuAccordion.vue b/packages/opendesign/src/menu/__docs__/__case__/MenuAccordion.vue
new file mode 100644
index 0000000000000000000000000000000000000000..8731a338a8e69bf9247646cc87f31e4c5f7ae974
--- /dev/null
+++ b/packages/opendesign/src/menu/__docs__/__case__/MenuAccordion.vue
@@ -0,0 +1,33 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 手风琴
+
+<!-- en-US -->
+
+### Accordion
+</docs>
+<script setup lang="ts">
+import { OMenu, OSubMenu, OMenuItem } from '@opensig/opendesign';
+</script>
+<template>
+  <OMenu accordion>
+    <OSubMenu value="1">
+      <template #title>Sub menu 1</template>
+      <OMenuItem value="1-1">Item 1-1</OMenuItem>
+      <OMenuItem value="1-2">Item 1-2</OMenuItem>
+    </OSubMenu>
+    <OSubMenu value="2">
+      <template #title>Sub menu 2</template>
+      <OMenuItem value="2-1">Item 2-1</OMenuItem>
+      <OSubMenu value="2-2">
+        <template #title>Sub menu 2-2</template>
+        <OMenuItem value="2-2-1" disabled>Item 2-2-1</OMenuItem>
+      </OSubMenu>
+      <OSubMenu value="2-3">
+        <template #title>Sub menu 2-3</template>
+        <OMenuItem value="2-3-1">Item 2-3-1</OMenuItem>
+      </OSubMenu>
+    </OSubMenu>
+  </OMenu>
+</template>
diff --git a/packages/opendesign/src/menu/__docs__/__case__/MenuSize.vue b/packages/opendesign/src/menu/__docs__/__case__/MenuSize.vue
new file mode 100644
index 0000000000000000000000000000000000000000..0d5fcf011705172711b332d6239f57121d29e588
--- /dev/null
+++ b/packages/opendesign/src/menu/__docs__/__case__/MenuSize.vue
@@ -0,0 +1,59 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 不同尺寸
+
+**注意**：在 `small` 尺寸下
+
+- 展开/收起图标移至左侧，并增加左侧分割线以增强层级区分。
+- 不再支持自定义左侧图标（即 `icon` 属性及 `icon` 插槽无效）。
+
+<!-- en-US -->
+
+### Different Sizes
+
+**Note**: In the `small` size
+
+- The expand/collapse icon is moved to the left and a left divider is added to enhance hierarchical distinction.
+- Custom left icons are no longer supported (i.e., the `icon` prop and `icon` slot are invalid).
+</docs>
+<script setup lang="ts">
+import { ref, resolveComponent, type Component } from 'vue';
+import { OMenu, OSubMenu, OMenuItem } from '@opensig/opendesign';
+
+const sizes = ['medium', 'small'] as const;
+const DocIconMenu = resolveComponent('DocIconMenu') as Component;
+
+const selected = ref('2-1');
+const expanded = ref(['2', '2-2', '2-2-2']);
+</script>
+<template>
+  <div class="menu-group">
+    <OMenu v-for="size in sizes" v-model="selected" v-model:expanded="expanded" :size="size" :key="size">
+      <OSubMenu :icon="DocIconMenu" value="1">
+        <template #title>Sub menu 1</template>
+        <OMenuItem value="1-1">Item 1-1</OMenuItem>
+        <OMenuItem value="1-2">Item 1-2</OMenuItem>
+      </OSubMenu>
+      <OSubMenu :icon="DocIconMenu" value="2">
+        <template #title>Sub menu 2</template>
+        <OMenuItem value="2-1">Item 2-1</OMenuItem>
+        <OSubMenu :icon="DocIconMenu" value="2-2">
+          <template #title>Sub menu 2-2</template>
+          <OMenuItem value="2-2-1" disabled>Item 2-2-1</OMenuItem>
+          <OSubMenu :icon="DocIconMenu" value="2-2-2">
+            <template #title>Sub menu 2-2-2</template>
+            <OMenuItem value="2-2-2-1">Item 2-2-2-1</OMenuItem>
+          </OSubMenu>
+        </OSubMenu>
+      </OSubMenu>
+      <OMenuItem value="3">Item 3</OMenuItem>
+    </OMenu>
+  </div>
+</template>
+<style scoped lang="scss">
+.menu-group {
+  display: flex;
+  gap: 64px;
+}
+</style>
diff --git a/packages/opendesign/src/menu/__docs__/index.en-US.md b/packages/opendesign/src/menu/__docs__/index.en-US.md
new file mode 100644
index 0000000000000000000000000000000000000000..b6ce1cea6aed08b449d2615839965e4db62f8ed0
--- /dev/null
+++ b/packages/opendesign/src/menu/__docs__/index.en-US.md
@@ -0,0 +1,18 @@
+---
+sidebar: OMenu
+kind: nav
+---
+
+# OMenu
+
+## Demo
+
+<!-- @case MenuSize -->
+<!-- @case MenuAccordion -->
+<!-- @case CustomIcon -->
+
+## API
+
+<!-- @api OMenu -->
+<!-- @api OSubMenu -->
+<!-- @api OMenuItem -->
diff --git a/packages/opendesign/src/menu/__docs__/index.zh-CN.md b/packages/opendesign/src/menu/__docs__/index.zh-CN.md
new file mode 100644
index 0000000000000000000000000000000000000000..447e98b71cb1c05437333b0d25579a5e4b2e7bf3
--- /dev/null
+++ b/packages/opendesign/src/menu/__docs__/index.zh-CN.md
@@ -0,0 +1,18 @@
+---
+sidebar: OMenu 菜单
+kind: nav
+---
+
+# OMenu 菜单
+
+## 示例
+
+<!-- @case MenuSize -->
+<!-- @case MenuAccordion -->
+<!-- @case CustomIcon -->
+
+## API
+
+<!-- @api OMenu -->
+<!-- @api OSubMenu -->
+<!-- @api OMenuItem -->
diff --git a/packages/opendesign/src/menu/types.ts b/packages/opendesign/src/menu/types.ts
index 45c05a13f964dd7ca3e9d742ff88c64c8cdf908e..e265ed95ba31fe18ab3469acd7aff8823c2cb4a7 100644
--- a/packages/opendesign/src/menu/types.ts
+++ b/packages/opendesign/src/menu/types.ts
@@ -8,46 +8,57 @@ export const menuProps = {
   /**
    * @zh-CN 菜单尺寸
    * @en-US Menu size
+   * @default 'medium'
    */
   size: {
     type: String as PropType<MenuSizeT>,
-    default: 'medium'
+    default: 'medium',
   },
   /**
-   * 是否开启手风琴模式
+   * @zh-CN 是否开启手风琴模式
+   * @en-US Whether to enable accordion mode
+   * @default false
    */
   accordion: {
     type: Boolean,
     default: false,
   },
   /**
-   * 层级缩进
+   * @zh-CN 层级缩进距离
+   * @en-US Nested Indentation Distance
+   * @default 20
    */
   levelIndent: {
     type: Number,
     default: 20,
   },
   /**
-   * 默认选中值 v-model
+   * @zh-CN 选中值
+   * @en-US Selected value
    */
   modelValue: {
     type: String,
   },
   /**
-   * 非受控模式时，默认选中值
+   * @zh-CN 非受控模式时，默认选中值
+   * @en-US Default selected value when not controlled
+   * @default ''
    */
   defaultValue: {
     type: String,
     default: '',
   },
   /**
-   * 默认展开的子菜单值 v-model
+   * @zh-CN 展开节点值
+   * @en-US Expanded node value
    */
   expanded: {
     type: Array as PropType<Array<string>>,
   },
   /**
-   * 非受控模式时，默认展开的子菜单值
+   * @zh-CN 非受控模式时，默认展开节点值
+   * @en-US Default expanded node value when not controlled
+   * @default []
    */
   defaultExpanded: {
     type: Array as PropType<Array<string>>,
@@ -59,13 +70,25 @@ export type MenuPropsT = ExtractPropTypes<typeof menuProps>;
 
 // SubMenuProps
 export const subMenuProps = {
+  /**
+   * @zh-CN 菜单项值
+   * @en-US Menu item value
+   */
   value: {
     type: String,
-    required: true,
+    required: true as const,
   },
+  /**
+   * @zh-CN 菜单项是否可选
+   * @en-US Whether the menu item is selectable
+   */
   selectable: {
     type: Boolean,
   },
+  /**
+   * @zh-CN 前缀图标
+   * @en-US Prefix icon
+   */
   icon: {
     type: Object as PropType<Component>,
   },
@@ -74,16 +97,26 @@ export type SubMenuPropsT = ExtractPropTypes<typeof subMenuProps>;
 
 // MenuItemProps
 export const menuItemProps = {
+  /**
+   * @zh-CN 菜单项值
+   * @en-US Menu item value
+   */
   value: {
     type: String,
-    required: true,
+    required: true as const,
   },
   /**
-   * 前缀图标
+   * @zh-CN 前缀图标
+   * @en-US Prefix icon
    */
   icon: {
     type: Object as PropType<Component>,
   },
+  /**
+   * @zh-CN 禁用
+   * @en-US Disabled
+   * @default false
+   */
   disabled: {
     type: Boolean,
     default: false,