@fjyueke/arco-mcp 1.0.4 → 1.0.5

package/metaData/components/index-bar/css-variables.md

@@ -4,17 +4,47 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 索引栏索引标题高度 | --arco-indexbar-group-left-spacing | getRem(16) |
-| 索引栏标题背景颜色 | --arco-indexbar-group-title-height | getRem(24) |
-| 索引栏内容子项高度 | --arco-indexbar-group-title-font-size | getRem(14) |
-| 索引栏内容子项字号大小 | --arco-indexbar-group-item-height | getRem(54) |
-| 索引栏侧边栏激活索引颜色 | --arco-indexbar-group-item-font-size | getRem(16) |
-| 索引栏侧边栏子项字号行高 | --arco-indexbar-sidebar-item-font-size | getRem(10) |
-| 索引栏侧边栏子项高度 | --arco-indexbar-sidebar-item-line-height | getRem(14) |
-| 索引栏侧边栏水滴提示气泡的内边距 | --arco-indexbar-sidebar-item-width | getRem(10) |
-| 索引栏侧边栏水滴字号大小 | --arco-indexbar-sidebar-sweat-right | getRem(36) |
-| 索引栏侧边栏水滴直径 | --arco-indexbar-sidebar-sweat-font-size | getRem(24) |
-| 索引栏侧边栏三角气泡位置 | --arco-indexbar-sidebar-sweat-radius | getRem(50) |
-| 索引栏侧边栏三角气泡的border | --arco-indexbar-sidebar-sweat-triangle-position | getRem(-28) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 索引栏，激活状态下的，索引文字颜色 | --arco-index-bar-group-active-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 索引栏标题字体颜色 | --arco-index-bar-group-title-font-color | #86909c（浅灰色） ⬜ | var(--arco-sub-info-font-color) |
+| 索引栏侧边栏激活索引颜色 | --arco-index-bar-sidebar-active-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 索引栏侧边栏水滴提示文案颜色 | --arco-index-bar-sidebar-sweat-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 索引栏侧边栏轻提示文案颜色 | --arco-index-bar-sidebar-toast-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 索引栏背景颜色 | --arco-index-bar-background | #FFFFFF（白色） ⬜ | var(--arco-background-color) |
+| 索引栏标题背景颜色 | --arco-index-bar-group-title-background | #f7f8fa |  |
+| 索引栏侧边栏水滴提示气泡背景颜色 | --arco-index-bar-sidebar-sweat-background | #333333 |  |
+| 索引栏侧边栏轻提示背景颜色 | --arco-index-bar-sidebar-toast-background | rgba(0, 0, 0, 0.8) |  |
+| 索引栏内容子项字号大小 | --arco-index-bar-group-item-font-size | 0.32rem | 16px |
+| 索引栏索引标题字号 | --arco-index-bar-group-title-font-size | 0.28rem | 14px |
+| 索引栏侧边栏子项字号大小 | --arco-index-bar-sidebar-item-font-size | 0.2rem | 10px |
+| 索引栏侧边栏水滴字号大小 | --arco-index-bar-sidebar-sweat-font-size | 0.48rem | 24px |
+| 索引栏侧边栏轻提示字号大小 | --arco-index-bar-sidebar-toast-font-size | 0.48rem | 24px |
+| 索引栏内容子项高度 | --arco-index-bar-group-item-height | 1.08rem | 54px |
+| 索引栏索引标题高度 | --arco-index-bar-group-title-height | 0.48rem | 24px |
+| 索引栏侧边栏子项字号行高 | --arco-index-bar-sidebar-item-line-height | 0.28rem | 14px |
+| 索引栏侧边栏轻提示方框高度 | --arco-index-bar-sidebar-toast-height | 0.96rem | 48px |
+| 索引栏侧边栏子项高度 | --arco-index-bar-sidebar-item-padding | 0.04rem 0.16rem | 2px 8px |
+| 索引栏侧边栏水滴提示气泡的内边距 | --arco-index-bar-sidebar-sweat-padding | 0 0.16rem | 0 8px |
+| 索引栏侧边栏轻提示内边距 | --arco-index-bar-sidebar-toast-padding | 0 0.16rem | 0 8px |
+| 索引栏侧边栏三角气泡的border | --arco-index-bar-sidebar-sweat-triangle-border | 0.36rem solid transparent | 18px solid transparent |
+| 索引栏侧边栏水滴直径 | --arco-index-bar-sidebar-sweat-radius | 1rem | 50px |
+| 索引栏侧边栏轻提示圆角大小 | --arco-index-bar-sidebar-toast-radius | 0.08rem | 4px |
+| 索引栏侧边栏子项宽度 | --arco-index-bar-sidebar-item-width | 0.2rem | 10px |
+| 索引栏内容左填充宽度 | --arco-index-bar-group-left-spacing | 0.32rem | 16px |
+| 索引栏侧边栏水滴离侧边栏的距离 | --arco-index-bar-sidebar-sweat-right | 0.72rem | 36px |
+| 索引栏侧边栏三角气泡位置 | --arco-index-bar-sidebar-sweat-triangle-position | -0.56rem | -28px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 索引栏，激活状态下的，索引文字颜色（暗黑模式） | --arco-dark-index-bar-group-active-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 索引栏标题字体颜色（暗黑模式） | --arco-dark-index-bar-group-title-font-color | #929293（暗黑辅助文字） ⬜ | var(--arco-dark-sub-info-font-color) |
+| 索引栏侧边栏激活索引颜色（暗黑模式） | --arco-dark-index-bar-sidebar-active-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 索引栏侧边栏水滴提示文案颜色（暗黑模式） | --arco-dark-index-bar-sidebar-sweat-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 索引栏侧边栏轻提示文案颜色（暗黑模式） | --arco-dark-index-bar-sidebar-toast-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 索引栏背景颜色（暗黑模式） | --arco-dark-index-bar-background | #17171A（暗黑背景） ⬛ | var(--arco-dark-background-color) |
+| 索引栏标题背景颜色（暗黑模式） | --arco-dark-index-bar-group-title-background | #2e2e30（暗黑浅线） ⬛ |  |

package/metaData/components/input/css-variables.md

@@ -4,17 +4,28 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 输入框 禁用状态文字色 | --arco-input-height | getRem(54) |
-| 输入框 外包层水平内边距 | --arco-input-label-gutter | getRem(24) |
-| 输入框 外包层垂直内边距 | --arco-input-horizontal-padding | getRem(16) |
-| 输入框 光标颜色 | --arco-input-vertical-padding | getRem(12) |
-| 输入框 文字字体大小 | --arco-input-label-min-width | getRem(64) |
-| 输入框 文字行高 | --arco-input-text-font-size | getRem(16) |
-| 多行文本框 字号 | --arco-input-text-line-height | getRem(22) |
-| 搜索输入框容器内边距大小 | --arco-input-search-bar-input-wrapper-height | getRem(36) |
-| 搜索输入框高度 | --arco-input-search-bar-input-wrapper-font-size | getRem(14) |
-| 搜索输入框光标颜色 | --arco-input-search-bar-input-height | getRem(20) |
-| 步进器输入框长度 | --arco-input-stepper-input-width | getRem(40) |
-| 步进器输入框外边距 | --arco-input-stepper-input-height | getRem(28) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 输入框 光标颜色 | --arco-input-caret-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 输入框 清除图标颜色 | --arco-input-clear-icon-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 输入框 禁用状态文字色 | --arco-input-disabled-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 输入框 占位文本颜色 | --arco-input-placeholder-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 输入框 清除图标大小 | --arco-input-clear-icon-font-size | 16PX |  |
+| 输入框 文字字体大小 | --arco-input-text-font-size | 0.32rem | 16px |
+| 输入框 高度 | --arco-input-height | 1.08rem | 54px |
+| 输入框 文字行高 | --arco-input-text-line-height | 0.44rem | 22px |
+| 输入框 外包层水平内边距 | --arco-input-horizontal-padding | 0.32rem | 16px |
+| 输入框 外包层垂直内边距 | --arco-input-vertical-padding | 0.24rem | 12px |
+| 输入框 前置内容右内边距 | --arco-input-label-gutter | 0.48rem | 24px |
+| 输入框 标签最小高度 | --arco-input-label-min-width | 1.28rem | 64px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 输入框 光标颜色（暗黑模式） | --arco-dark-input-caret-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 输入框 清除图标颜色（暗黑模式） | --arco-dark-input-clear-icon-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |
+| 输入框 禁用状态文字色（暗黑模式） | --arco-dark-input-disabled-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |
+| 输入框 占位文本颜色（暗黑模式） | --arco-dark-input-placeholder-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |

package/metaData/components/keyboard/css-variables.md

@@ -4,13 +4,33 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 键盘统一边距 | --arco-keyboard-content-padding | getRem(8) |
-| 键盘右边一列确认键背景色 | --arco-keyboard-unified-margin | getRem(8) |
-| 键盘按钮字重 | --arco-keyboard-confirm-key-font-size | getRem(18) |
-| 键盘按钮中的图标大小 | --arco-keyboard-key-font-size | getRem(22) |
-| 键盘按钮字体行高 | --arco-keyboard-key-icon-size | getRem(26) |
-| 键盘按钮背景色 | --arco-keyboard-key-line-height | getRem(30) |
-| 键盘按钮高度 | --arco-keyboard-key-border-radius | getRem(4) |
-| 键盘按钮字体颜色 | --arco-keyboard-key-height | getRem(48) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 键盘右边一列确认键字体颜色 | --arco-keyboard-confirm-key-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 键盘按钮字体颜色 | --arco-keyboard-key-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| 键盘背景颜色 | --arco-keyboard-background | #f2f3f5（灰底色） ⬜ |  |
+| 键盘右边一列确认键背景色 | --arco-keyboard-confirm-key-background | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 键盘按钮背景色激活状态下 | --arco-keyboard-key-active-background | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| 键盘按钮背景色 | --arco-keyboard-key-background | #ffffff |  |
+| 键盘按钮字重 | --arco-keyboard-key-font-weight | 500 |  |
+| 键盘右边一列确认键字体大小 | --arco-keyboard-confirm-key-font-size | 0.36rem | 18px |
+| 键盘按钮字体大小 | --arco-keyboard-key-font-size | 0.44rem | 22px |
+| 键盘按钮中的图标大小 | --arco-keyboard-key-icon-size | 0.52rem | 26px |
+| 键盘按钮高度 | --arco-keyboard-key-height | 0.96rem | 48px |
+| 键盘按钮字体行高 | --arco-keyboard-key-line-height | 0.6rem | 30px |
+| 键盘内边距 | --arco-keyboard-content-padding | 0.16rem | 8px |
+| 键盘统一边距 | --arco-keyboard-unified-margin | 0.16rem | 8px |
+| 键盘按钮圆角 | --arco-keyboard-key-border-radius | 0.08rem | 4px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 键盘右边一列确认键字体颜色（暗黑模式） | --arco-dark-keyboard-confirm-key-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 键盘按钮字体颜色（暗黑模式） | --arco-dark-keyboard-key-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| 键盘背景颜色（暗黑模式） | --arco-dark-keyboard-background | #232324（暗黑容器） ⬛ |  |
+| 键盘右边一列确认键背景色（暗黑模式） | --arco-dark-keyboard-confirm-key-background | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 键盘按钮背景色激活状态下（暗黑模式） | --arco-dark-keyboard-key-active-background | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| 键盘按钮背景色（暗黑模式） | --arco-dark-keyboard-key-background | #2e2e30（暗黑浅线） ⬛ |  |

package/metaData/components/load-more/css-variables.md

@@ -4,29 +4,15 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 加载更多文字颜色 | --arco-loadmore-font-size | getRem(14) |
-| 单元格标题文字大小 | --arco-loadmore-cell-desc-font-size | getRem(14) |
-| 单元格标题文字字重 | --arco-loadmore-cell-title-font-size | getRem(15) |
-| 单元格内容文字大小 | --arco-loadmore-cell-desc-margin-top | getRem(2) |
-| 单元格右箭头图标颜色 | --arco-loadmore-cell-content-font-size | getRem(14) |
-| 单元格右箭头自定义图标大小 | --arco-loadmore-cell-arrow-gutter | getRem(8) |
-| 单元格背景色 | --arco-loadmore-cell-arrow-font-size | getRem(12) |
-| 单元格两侧横向间距 | --arco-loadmore-cell-font-size | getRem(16) |
-| 单元格基础样式高度 | --arco-loadmore-cell-horizontal-padding | getRem(16) |
-| 单元格有描述文字时的高度 | --arco-loadmore-cell-item-height | getRem(54) |
-| 单元格标签文字右侧间距 | --arco-loadmore-cell-item-has-desc-height | getRem(74) |
-| 单元格标签图标右侧间距 | --arco-loadmore-cell-label-gutter | getRem(24) |
-| 单元格标签图标大小 | --arco-loadmore-cell-label-icon-gutter | getRem(12) |
-| 单元格头部和尾部说明文字大小 | --arco-loadmore-cell-label-icon-font-size | getRem(20) |
-| 单元格头部和尾部说明文字行高 | --arco-loadmore-cell-extra-font-size | getRem(14) |
-| 单元格头部和尾部说明内边距 | --arco-loadmore-cell-extra-line-height | getRem(20) |
-| 倒计时默认字体行高 | --arco-loadmore-count-down-font-size | getRem(16) |
-| 倒计时默认字体颜色 | --arco-loadmore-count-down-line-height | getRem(22) |
-| 动作面板选项字体大小 | --arco-loadmore-action-sheet-item-height | getRem(54) |
-| 动作面板顶部圆角值 | --arco-loadmore-action-sheet-item-font-size | getRem(16) |
-| 动作面板取消按钮顶线颜色 | --arco-loadmore-action-sheet-border-radius | getRem(8) |
-| 动作面板头部标题字体大小 | --arco-loadmore-action-sheet-header-padding | getRem(16) |
-| 动作面板头部描述字体大小 | --arco-loadmore-action-sheet-title-font-size | getRem(16) |
-| 搜索栏内边距大小 | --arco-loadmore-action-sheet-sub-title-font-size | getRem(14) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 加载更多文字颜色 | --arco-load-more-text-color | #86909c（浅灰色） ⬜ | var(--arco-sub-info-font-color) |
+| 加载更多文字大小 | --arco-load-more-font-size | 0.28rem | 14px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 加载更多文字颜色（暗黑模式） | --arco-dark-load-more-text-color | #929293（暗黑辅助文字） ⬜ | var(--arco-dark-sub-info-font-color) |

package/metaData/components/loading/css-variables.md

@@ -4,7 +4,18 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| toast 距屏幕边缘的安全距离 | --arco-loading-toast-loading-inner-font-size | getRem(12) |
-| 选择器选项字体大小 | --arco-loading-dot-gutter | getRem(6) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| loading type=arc 时底圈的背景色 | --arco-loading-arc-background-color | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| loading 主颜色 | --arco-loading-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| loading type=dot 时圆点大小 | --arco-loading-dot-size | 6PX |  |
+| loading type=dot 时圆点间距 | --arco-loading-dot-gutter | 0.12rem | 6px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| loading type=arc 时底圈的背景色（暗黑模式） | --arco-dark-loading-arc-background-color | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| loading 主颜色（暗黑模式） | --arco-dark-loading-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |

package/metaData/components/nav-bar/css-variables.md

@@ -4,10 +4,25 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| navBar 下边框颜色 | --arco-navbar-height | getRem(44) |
-| navBar 左右两侧内边距 | --arco-navbar-two-sides-font-size | getRem(16) |
-| navBar 标题区域文字字体大小 | --arco-navbar-title-font-size | getRem(17) |
-| navBar 标题区域左右内边距 | --arco-navbar-title-text-font-size | getRem(17) |
-| 图片 placeholder 背景色 | --arco-navbar-back-icon-height | getRem(16) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| navBar 下边框颜色 | --arco-nav-bar-bottom-border-color | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| navBar 字体颜色 | --arco-nav-bar-font-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| navBar 背景色 | --arco-nav-bar-background | #FFFFFF（白色） ⬜ | var(--arco-background-color) |
+| navBar 标题区域字体大小 | --arco-nav-bar-title-font-size | 0.34rem | 17px |
+| navBar 标题区域文字字体大小 | --arco-nav-bar-title-text-font-size | 0.34rem | 17px |
+| navBar 左右两侧字体大小 | --arco-nav-bar-two-sides-font-size | 0.32rem | 16px |
+| navBar 返回图标高度 | --arco-nav-bar-back-icon-height | 0.32rem | 16px |
+| navBar 高度 | --arco-nav-bar-height | 0.88rem | 44px |
+| navBar 标题区域左右内边距 | --arco-nav-bar-title-padding | 0 0.92rem | 0 46px |
+| navBar 左右两侧内边距 | --arco-nav-bar-two-sides-padding | 0 0.32rem | 0 16px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| navBar 下边框颜色（暗黑模式） | --arco-dark-nav-bar-bottom-border-color | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| navBar 字体颜色（暗黑模式） | --arco-dark-nav-bar-font-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| navBar 背景色（暗黑模式） | --arco-dark-nav-bar-background | #17171A（暗黑背景） ⬛ | var(--arco-dark-background-color) |

package/metaData/components/notice-bar/css-variables.md

@@ -4,11 +4,26 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 通知栏文字大小 | --arco-noticebar-line-height | getRem(20) |
-| 通知栏图标大小 | --arco-noticebar-text-font-size | getRem(14) |
-| 通知栏内容与容器的纵向间距 | --arco-noticebar-single-line-height | getRem(36) |
-| 通知栏内容之间的横向间距 | --arco-noticebar-vertical-padding | getRem(8) |
-| 通知栏两侧渐变的宽度 | --arco-noticebar-horizontal-padding | getRem(8) |
-| notify 成功通知背景色 | --arco-noticebar-gradient-width | getRem(8) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 通知栏文字颜色 | --arco-notice-bar-color | #FF7D00（警告橙） 🟧 | var(--arco-warning-color) |
+| 通知栏背景色 | --arco-notice-bar-background | #FFF7E8 |  |
+| 通知栏文字滚动时两侧渐变色 | --arco-notice-bar-gradient-background | linear-gradient(to right, #fff7e8, rgba(255, 247, 232, 0)) |  |
+| 通知栏图标大小 | --arco-notice-bar-icon-font-size | 16PX |  |
+| 通知栏文字大小 | --arco-notice-bar-text-font-size | 0.28rem | 14px |
+| 通知栏在可换行时的文字行高 | --arco-notice-bar-line-height | 0.4rem | 20px |
+| 通知栏不可换行时所占高度 | --arco-notice-bar-single-line-height | 0.72rem | 36px |
+| 通知栏内容之间的横向间距 | --arco-notice-bar-horizontal-padding | 0.16rem | 8px |
+| 通知栏内容与容器的纵向间距 | --arco-notice-bar-vertical-padding | 0.16rem | 8px |
+| 通知栏外层容器内边距 | --arco-notice-bar-wrapper-padding | 0 0.32rem | 0 16px |
+| 通知栏两侧渐变的宽度 | --arco-notice-bar-gradient-width | 0.16rem | 8px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 通知栏文字颜色（暗黑模式） | --arco-dark-notice-bar-color | #FF9626（暗黑橙） 🟧 | var(--arco-dark-warning-color) |
+| 通知栏背景色（暗黑模式） | --arco-dark-notice-bar-background | #4D1B00 |  |
+| 通知栏文字滚动时两侧渐变色（暗黑模式） | --arco-dark-notice-bar-gradient-background | linear-gradient(to right, #4D1B00, rgba(77, 27, 0, 0)) |  |

package/metaData/components/notify/css-variables.md

@@ -4,7 +4,24 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| notify 内容最小高度 | --arco-notify-font-size | getRem(14) |
-| steps 上下内边距 | --arco-notify-min-height | getRem(36) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| notify 字体颜色 | --arco-notify-font-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| notify info 类型样式下字体颜色 | --arco-notify-info-font-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| notify 错误通知背景色 | --arco-notify-error-background | #F53F3F（危险红） 🟥 | var(--arco-danger-color) |
+| notify 成功通知背景色 | --arco-notify-success-background | #00B42A（成功绿） 🟩 | var(--arco-success-color) |
+| notify 警告通知背景色 | --arco-notify-warn-background | #FF7D00（警告橙） 🟧 | var(--arco-warning-color) |
+| notify 字体大小 | --arco-notify-font-size | 0.28rem | 14px |
+| notify 内容最小高度 | --arco-notify-min-height | 0.72rem | 36px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| notify 字体颜色（暗黑模式） | --arco-dark-notify-font-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| notify info 类型样式下字体颜色（暗黑模式） | --arco-dark-notify-info-font-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| notify 错误通知背景色（暗黑模式） | --arco-dark-notify-error-background | #F76965（暗黑红） 🟥 | var(--arco-dark-danger-color) |
+| notify 成功通知背景色（暗黑模式） | --arco-dark-notify-success-background | #27C346（暗黑绿） 🟩 | var(--arco-dark-success-color) |
+| notify 警告通知背景色（暗黑模式） | --arco-dark-notify-warn-background | #FF9626（暗黑橙） 🟧 | var(--arco-dark-warning-color) |

package/metaData/components/pagination/css-variables.md

@@ -4,12 +4,43 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 分页器字体大小 | --arco-pagination-center-field-gutter | getRem(24) |
-| 分页器字体行高 | --arco-pagination-field-font-size | getRem(15) |
-| 分页器翻页按钮最小高度 | --arco-pagination-field-line-height | getRem(22) |
-| 分页器翻页按钮文字与图标的间距 | --arco-pagination-field-btn-text-font-size | getRem(14) |
-| 分页器翻页primary按钮背景颜色 | --arco-pagination-field-btn-icon-text-gutter | getRem(11) |
-| 分页器页码显示文字行高 | --arco-pagination-item-font-size | getRem(18) |
-| 分页器页码显示当前页文字颜色 | --arco-pagination-item-line-height | getRem(22) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 分页器翻页按钮默认字体颜色 | --arco-pagination-field-default-text-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| 分页器翻页按钮禁用字体颜色 | --arco-pagination-field-disabled-text-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 分页器翻页primary按钮字体颜色 | --arco-pagination-field-primary-text-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 分页器翻页文字按钮字体颜色 | --arco-pagination-field-text-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| 分页器翻页文字primary按钮字体颜色 | --arco-pagination-field-text-primary-text-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 分页器页码显示默认颜色 | --arco-pagination-item-default-text-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| 分页器页码显示当前页文字颜色 | --arco-pagination-item-primary-text-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 分页器翻页默认按钮背景色 | --arco-pagination-field-default-background | #F7F8FA | var(--arco-card-background-color) |
+| 分页器翻页按钮禁用背景颜色 | --arco-pagination-field-disabled-background | #F7F8FA | var(--arco-card-background-color) |
+| 分页器翻页primary按钮背景颜色 | --arco-pagination-field-primary-background | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 分页器翻页按钮文字大小 | --arco-pagination-field-btn-text-font-size | 0.28rem | 14px |
+| 分页器字体大小 | --arco-pagination-field-font-size | 0.3rem | 15px |
+| 分页器页码显示文字大小 | --arco-pagination-item-font-size | 0.36rem | 18px |
+| 分页器翻页按钮最小高度 | --arco-pagination-field-button-min-height | 0.64rem | 32px |
+| 分页器字体行高 | --arco-pagination-field-line-height | 0.44rem | 22px |
+| 分页器页码显示文字行高 | --arco-pagination-item-line-height | 0.44rem | 22px |
+| 分页器翻页按钮内边距 | --arco-pagination-field-button-padding | 0.12rem 0.32rem | 6px 16px |
+| 分页器内边距 | --arco-pagination-padding | 0.22rem 0.32rem | 11px 16px |
+| 分页器翻页按钮圆角值 | --arco-pagination-field-button-border-radius | 0.04rem | 2px |
+| 分页器居中对齐时翻页按钮与页码的间距 | --arco-pagination-center-field-gutter | 0.48rem | 24px |
+| 分页器翻页按钮文字与图标的间距 | --arco-pagination-field-btn-icon-text-gutter | 0.22rem | 11px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 分页器翻页按钮默认字体颜色（暗黑模式） | --arco-dark-pagination-field-default-text-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| 分页器翻页按钮禁用字体颜色（暗黑模式） | --arco-dark-pagination-field-disabled-text-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |
+| 分页器翻页primary按钮字体颜色（暗黑模式） | --arco-dark-pagination-field-primary-text-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 分页器翻页文字按钮字体颜色（暗黑模式） | --arco-dark-pagination-field-text-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| 分页器翻页文字primary按钮字体颜色（暗黑模式） | --arco-dark-pagination-field-text-primary-text-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 分页器页码显示默认颜色（暗黑模式） | --arco-dark-pagination-item-default-text-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| 分页器页码显示当前页文字颜色（暗黑模式） | --arco-dark-pagination-item-primary-text-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 分页器翻页默认按钮背景色（暗黑模式） | --arco-dark-pagination-field-default-background | hsla(0, 0%, 100%, 0.08) | var(--arco-dark-card-background-color) |
+| 分页器翻页按钮禁用背景颜色（暗黑模式） | --arco-dark-pagination-field-disabled-background | hsla(0, 0%, 100%, 0.08) | var(--arco-dark-card-background-color) |
+| 分页器翻页primary按钮背景颜色（暗黑模式） | --arco-dark-pagination-field-primary-background | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |

package/metaData/components/picker/css-variables.md

@@ -4,13 +4,34 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 选择器选项高度 | --arco-picker-view-font-size | getRem(16) |
-| 选择器容器高度 | --arco-picker-view-cell-height | getRem(44) |
-| 选择器上半区蒙层渐变颜色 | --arco-picker-view-wrapper-height | getRem(220) |
-| 选择器顶部操作栏高度 | --arco-picker-wrapper-border-radius | getRem(4) |
-| 选择器顶部操作栏背景色 | --arco-picker-header-height | getRem(54) |
-| 选择器标题内边距 | --arco-picker-title-font-size | getRem(16) |
-| 日期时间范围选择器背景颜色 | --arco-picker-date-picker-range-font-size | getRem(16) |
-| 日期时间范围选择器展示区域分隔符最小宽度 | --arco-picker-date-picker-range-show-min-height | getRem(48) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 选择器左侧按钮字体颜色 | --arco-picker-left-btn-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 选择器右侧按钮字体颜色 | --arco-picker-right-btn-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 选择器选中选择框的边框颜色 | --arco-picker-view-selection-border-color | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| 选择器顶部操作栏背景色 | --arco-picker-header-background | #FFFFFF（白色） ⬜ | var(--arco-mask-content-background) |
+| 选择器下半区蒙层渐变颜色 | --arco-picker-view-mask-bottom-background | linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 65%) |  |
+| 选择器上半区蒙层渐变颜色 | --arco-picker-view-mask-top-background | linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 65%) |  |
+| 选择器按钮文字大小 | --arco-picker-button-font-size | 0.3rem | 15px |
+| 选择器标题文字大小 | --arco-picker-title-font-size | 0.32rem | 16px |
+| 选择器选项字体大小 | --arco-picker-view-font-size | 0.32rem | 16px |
+| 选择器顶部操作栏高度 | --arco-picker-header-height | 1.08rem | 54px |
+| 选择器选项高度 | --arco-picker-view-cell-height | 0.88rem | 44px |
+| 选择器容器高度 | --arco-picker-view-wrapper-height | 4.4rem | 220px |
+| 选择器按钮内边距 | --arco-picker-button-padding | 0.32rem | 16px |
+| 选择器标题内边距 | --arco-picker-title-padding | 0 1.2rem | 0 60px |
+| 选择器弹窗顶部圆角值 | --arco-picker-wrapper-border-radius | 0.08rem | 4px |
+| 选择器弹窗阴影值 | --arco-picker-wrapper-shadow | 0 2PX 8PX rgba(0, 0, 0, .15) |  |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 选择器左侧按钮字体颜色（暗黑模式） | --arco-dark-picker-left-btn-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 选择器右侧按钮字体颜色（暗黑模式） | --arco-dark-picker-right-btn-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 选择器选中选择框的边框颜色（暗黑模式） | --arco-dark-picker-view-selection-border-color | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| 选择器顶部操作栏背景色（暗黑模式） | --arco-dark-picker-header-background | #2A2A2B（暗黑面板） ⬛ | var(--arco-dark-mask-content-background) |
+| 选择器下半区蒙层渐变颜色（暗黑模式） | --arco-dark-picker-view-mask-bottom-background | linear-gradient(to top, rgba(42, 42, 43, 1) 0%, rgba(42, 42, 43, 0.7) 65%) |  |
+| 选择器上半区蒙层渐变颜色（暗黑模式） | --arco-dark-picker-view-mask-top-background | linear-gradient(to bottom, rgba(42, 42, 43, 1) 0%, rgba(42, 42, 43, 0.7) 65%) |  |

package/metaData/components/picker-view/css-variables.md

@@ -4,13 +4,21 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 选择器选项高度 | --arco-pickerview-font-size | getRem(16) |
-| 选择器容器高度 | --arco-pickerview-cell-height | getRem(44) |
-| 选择器上半区蒙层渐变颜色 | --arco-pickerview-wrapper-height | getRem(220) |
-| 选择器顶部操作栏高度 | --arco-pickerview-picker-wrapper-border-radius | getRem(4) |
-| 选择器顶部操作栏背景色 | --arco-pickerview-picker-header-height | getRem(54) |
-| 选择器标题内边距 | --arco-pickerview-picker-title-font-size | getRem(16) |
-| 日期时间范围选择器背景颜色 | --arco-pickerview-date-picker-range-font-size | getRem(16) |
-| 日期时间范围选择器展示区域分隔符最小宽度 | --arco-pickerview-date-picker-range-show-min-height | getRem(48) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 选择器选中选择框的边框颜色 | --arco-picker-view-selection-border-color | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| 选择器下半区蒙层渐变颜色 | --arco-picker-view-mask-bottom-background | linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 65%) |  |
+| 选择器上半区蒙层渐变颜色 | --arco-picker-view-mask-top-background | linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 65%) |  |
+| 选择器选项字体大小 | --arco-picker-view-font-size | 0.32rem | 16px |
+| 选择器选项高度 | --arco-picker-view-cell-height | 0.88rem | 44px |
+| 选择器容器高度 | --arco-picker-view-wrapper-height | 4.4rem | 220px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 选择器选中选择框的边框颜色（暗黑模式） | --arco-dark-picker-view-selection-border-color | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| 选择器下半区蒙层渐变颜色（暗黑模式） | --arco-dark-picker-view-mask-bottom-background | linear-gradient(to top, rgba(42, 42, 43, 1) 0%, rgba(42, 42, 43, 0.7) 65%) |  |
+| 选择器上半区蒙层渐变颜色（暗黑模式） | --arco-dark-picker-view-mask-top-background | linear-gradient(to bottom, rgba(42, 42, 43, 1) 0%, rgba(42, 42, 43, 0.7) 65%) |  |

package/metaData/components/popover/css-variables.md

@@ -4,11 +4,55 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 气泡内容文字行高 | --arco-popover-content-font-size | getRem(14) |
-| 气泡内容禁用态文字颜色 | --arco-popover-content-line-height | getRem(20) |
-| 横向菜单项大小 | --arco-popover-horizontal-menu-max-width | getRem(288) |
-| 横向菜单项padding | --arco-popover-horizontal-menu-item-size | getRem(72) |
-| 关闭icon padding | --arco-popover-icon-size | getRem(16) |
-| 气泡遮罩背景色 | --arco-popover-text-suffix-edge | getRem(12) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 气泡背景 | --arco-popover-background-color | #000000 |  |
+| 气泡内容border颜色 | --arco-popover-content-border-color | rgba(247, 248, 250, 0.1) |  |
+| 气泡内容文字颜色 | --arco-popover-content-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 气泡内容禁用态文字颜色 | --arco-popover-content-disabled-color | rgba(255, 255, 255, 0.3) |  |
+| 白色主题气泡内容border颜色 | --arco-popover-content-white-theme-border-color | #e5e6eb（边框灰） ⬜ | var(--arco-line-color) |
+| 白色主题气泡内容文字颜色 | --arco-popover-content-white-theme-color | #1d2129（深灰色） ⬛ | var(--arco-font-color) |
+| 白色主题气泡内容禁用态文字颜色 | --arco-popover-content-white-theme-disabled-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 关闭图标左侧的分割线颜色 | --arco-popover-icon-divider-color | rgba(255, 255, 255, 0.3) |  |
+| 白色主题气泡菜单的icon颜色 | --arco-popover-menu-icon-white-theme-color | #4e5969（中灰色） ⬛ | var(--arco-sub-font-color) |
+| 气泡阴影颜色 | --arco-popover-shadow-color | rgba(0, 0, 0, 0.1) |  |
+| 白色主题气泡背景 | --arco-popover-white-theme-background-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-background) |
+| 气泡内容背景阴影值 | --arco-popover-inner-background-shadow | 0 2PX 8PX 0 rgba(0, 0, 0, .1) |  |
+| 气泡遮罩背景色 | --arco-popover-mask-background | rgba(0, 0, 0, 0.6) | var(--arco-mask-background) |
+| 气泡菜单选中态背景色 | --arco-popover-menu-active-background | #242425 |  |
+| 白色主题气泡菜单选中态背景色 | --arco-popover-menu-active-white-theme-background | #F7F8FA | var(--arco-card-background-color) |
+| 气泡尖角大小 | --arco-popover-arrow-size | 9PX |  |
+| 气泡内容文字大小 | --arco-popover-content-font-size | 0.28rem | 14px |
+| 横向菜单项大小 | --arco-popover-horizontal-menu-item-size | 1.44rem | 72px |
+| 关闭icon大小 | --arco-popover-icon-size | 0.32rem | 16px |
+| 气泡内容文字行高 | --arco-popover-content-line-height | 0.4rem | 20px |
+| 关闭图标左侧的分割线高度 | --arco-popover-icon-divider-height | 0.24rem | 12px |
+| Android设备气泡内容区padding | --arco-popover-content-android-padding | 0.2rem 0.24rem 0.12rem | 10px 12px 6px |
+| 气泡内容区padding | --arco-popover-content-padding | 0.16rem 0.24rem | 8px 12px |
+| 横向菜单项padding | --arco-popover-horizontal-menu-item-padding | 0.24rem 0 | 12px 0 |
+| 关闭icon padding | --arco-popover-icon-padding | 0 0.2rem 0 0.22rem | 0 10px 0 11px |
+| 气泡菜单内容padding | --arco-popover-menu-content-padding | 0 0.24rem | 0 12px |
+| 横向菜单项margin | --arco-popover-horizontal-menu-icon-margin | 0 0 0.16rem 0 | 0 0 8px 0 |
+| 气泡尖角圆角大小 | --arco-popover-arrow-border-radius | 1PX |  |
+| 气泡内容圆角大小 | --arco-popover-inner-border-radius | 4PX |  |
+| 气泡内容底部箭头阴影值 | --arco-popover-inner-bottom-arrow-shadow | -6PX -6PX 8PX 0 rgba(0, 0, 0, .04) |  |
+| 气泡内容顶部箭头阴影值 | --arco-popover-inner-top-arrow-shadow | 6PX 6PX 8PX 0 rgba(0, 0, 0, .04) |  |
+| 横向菜单气泡最大宽度 | --arco-popover-horizontal-menu-max-width | 5.76rem | 288px |
+| 气泡内容透明度 | --arco-popover-inner-opacity | 0.8 |  |
+| 气泡内容动画曲线 | --arco-popover-inner-transition | opacity .3s ease-in-out |  |
+| 白色主题气泡内容透明度 | --arco-popover-inner-white-theme-opacity | 1 |  |
+| textSuffix 元素和气泡边缘的距离 | --arco-popover-text-suffix-edge | 0.24rem | 12px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 气泡内容文字颜色（暗黑模式） | --arco-dark-popover-content-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 白色主题气泡内容border颜色（暗黑模式） | --arco-dark-popover-content-white-theme-border-color | #484849（暗黑深线） ⬛ | var(--arco-dark-line-color) |
+| 白色主题气泡内容文字颜色（暗黑模式） | --arco-dark-popover-content-white-theme-color | #f6f6f6（暗黑文字） ⬜ | var(--arco-dark-font-color) |
+| 白色主题气泡内容禁用态文字颜色（暗黑模式） | --arco-dark-popover-content-white-theme-disabled-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |
+| 白色主题气泡菜单的icon颜色（暗黑模式） | --arco-dark-popover-menu-icon-white-theme-color | #c5c5c5（暗黑次文字） ⬜ | var(--arco-dark-sub-font-color) |
+| 白色主题气泡背景（暗黑模式） | --arco-dark-popover-white-theme-background-color | #2A2A2B（暗黑面板） ⬛ | var(--arco-dark-mask-content-background) |
+| 白色主题气泡菜单选中态背景色（暗黑模式） | --arco-dark-popover-menu-active-white-theme-background | hsla(0, 0%, 100%, 0.08) | var(--arco-dark-card-background-color) |

package/metaData/components/popup/css-variables.md

@@ -0,0 +1,20 @@
+## 主题定制
+
+### 样式变量
+
+组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
+
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 弹窗内容面板背景色 | --arco-popup-content-background | #FFFFFF（白色） ⬜ | var(--arco-mask-content-background) |
+| 弹窗蒙层背景色 | --arco-popup-mask-background | rgba(0, 0, 0, 0.6) | var(--arco-mask-background) |
+| 打开弹窗时的变化曲线 | --arco-popup-enter-transition | all 450ms cubic-bezier(0.34, 0.69, 0.1, 1) |  |
+| 关闭弹窗时的变化曲线 | --arco-popup-exit-transition | all 240ms cubic-bezier(0.34, 0.69, 0.1, 1) |  |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 弹窗内容面板背景色（暗黑模式） | --arco-dark-popup-content-background | #2A2A2B（暗黑面板） ⬛ | var(--arco-dark-mask-content-background) |

package/metaData/components/progress/css-variables.md

@@ -4,12 +4,35 @@
 
 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。
 
-| 描述 | 名称 | 默认值 |
-| --- | --- | --- |
-| 环形进度条 进度条颜色 | --arco-progress-circle-progress-font-size | getRem(14) |
-| 进度条 文字大小 | --arco-progress-text-gutter | getRem(8) |
-| 进度条 跟随进度样式的文字大小 | --arco-progress-text-font-size | getRem(14) |
-| 进度条 跟随进度样式的文字圆角值 | --arco-progress-text-follow-font-size | getRem(13) |
-| 进度条 跟随进度样式的文字宽度 | --arco-progress-text-follow-border-radius | getRem(20) |
-| 进度条 跟随进度样式的文字高度 | --arco-progress-text-follow-width | getRem(36) |
-| 渐隐过渡效果持续时长 | --arco-progress-text-follow-height | getRem(20) |
+#### 浅色模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 进度条 不可用状态进度条颜色 | --arco-progress-disabled-color | #c9cdd4（极浅灰色） ⬜ | var(--arco-disabled-color) |
+| 进度条 不可用状态文字颜色 | --arco-progress-disabled-text-color | #86909c（浅灰色） ⬜ | var(--arco-sub-info-font-color) |
+| 进度条 自定义进度条颜色渐变结束的颜色 | --arco-progress-linear-gradient-end-color | #14CAFF |  |
+| 进度条 自定义进度条颜色渐变开始的颜色 | --arco-progress-linear-gradient-start-color | #4776E6 |  |
+| 进度条 自定义进度条文字颜色 | --arco-progress-linear-gradient-text-color | #3C89EC |  |
+| 进度条 导航式进度条轨道颜色 | --arco-progress-nav-track-color | transparent（透明） ❓ |  |
+| 进度条 进度条颜色 | --arco-progress-primary-color | #165DFF（主题蓝） 🟦 | var(--arco-primary-color) |
+| 进度条 百分比内显文字颜色 | --arco-progress-text-inner-color | #FFFFFF（白色） ⬜ | var(--arco-mask-content-color) |
+| 进度条 轨道颜色 | --arco-progress-track-color | #f2f3f5（灰底色） ⬜ | var(--arco-lighter-line-color) |
+| 进度条 跟随进度样式的文字大小 | --arco-progress-text-follow-font-size | 0.26rem | 13px |
+| 进度条 文字大小 | --arco-progress-text-font-size | 0.28rem | 14px |
+| 进度条 百分比内显轨道高度 | --arco-progress-inner-track-height | 18PX |  |
+| 进度条 导航式进度条轨道高度 | --arco-progress-nav-track-height | 2PX |  |
+| 进度条 跟随进度样式的文字高度 | --arco-progress-text-follow-height | 0.4rem | 20px |
+| 进度条 轨道高度 | --arco-progress-track-height | 4PX |  |
+| 进度条 跟随进度样式的文字圆角值 | --arco-progress-text-follow-border-radius | 0.4rem | 20px |
+| 进度条 文字在两侧时与进度条的间距 | --arco-progress-text-gutter | 0.16rem | 8px |
+| 进度条 跟随进度样式的文字宽度 | --arco-progress-text-follow-width | 0.72rem | 36px |
+
+#### 暗黑模式
+
+| 描述 | 名称 | 默认值 | 备注 |
+| --- | --- | --- | --- |
+| 进度条 不可用状态进度条颜色（暗黑模式） | --arco-dark-progress-disabled-color | #5f5f60（暗黑禁用） ⬛ | var(--arco-dark-disabled-color) |
+| 进度条 不可用状态文字颜色（暗黑模式） | --arco-dark-progress-disabled-text-color | #929293（暗黑辅助文字） ⬜ | var(--arco-dark-sub-info-font-color) |
+| 进度条 进度条颜色（暗黑模式） | --arco-dark-progress-primary-color | #3C7EFF（主题浅蓝） 🟦 | var(--arco-dark-primary-color) |
+| 进度条 百分比内显文字颜色（暗黑模式） | --arco-dark-progress-text-inner-color | rgba(255, 255, 255, 0.9) | var(--arco-dark-mask-content-color) |
+| 进度条 轨道颜色（暗黑模式） | --arco-dark-progress-track-color | #2e2e30（暗黑浅线） ⬛ | var(--arco-dark-lighter-line-color) |