docs: define ui status color guidance

2026-07-04 17:47:36 +08:00
parent c40de68379
commit 8522032b06
3 changed files with 64 additions and 0 deletions
@@ -457,6 +457,34 @@ Shift 锁比例
 画布背景：#9a9da3
 ```

+### 10.1 状态色使用规则
+
+状态色只用于表达状态、风险、错误和完成结果，不作为装饰色使用。普通 label、区域标题、普通按钮、普通输入框、普通下拉框保持黑灰色体系；不能为了“更醒目”而给静态说明文字加颜色。
+
+推荐映射：
+
+```text
+待处理 / 未开始 / 跳过：中性灰 #666666 / #8a8a8a
+等待中 / 生成中 / 导出中 / 停止中：信息蓝 #0078d4
+写入中 / 已完成 / 成功：完成绿 #107c10
+偏低 / 需注意 / 配置风险：警告橙 #b87a00
+失败 / 超时 / 不可用 / 不明显：错误红 #c42b1c
+```
+
+适用组件：
+
+- 异步任务状态文字或状态徽章：标题生成、图片生成、批量导出、停止中、写入中、完成、失败。
+- 表格中的状态列、可见度列、失败原因提示；优先给状态单元格或状态徽章上色，不给整行大面积染色。
+- 低对比 / 可见度结果：`正常` 可用完成绿或默认色，`偏低` 用警告橙，`不明显` 用错误红，且必须保留文字标签。
+- 配置和校验错误：API Key 缺失、模型不可用、输出目录不可写、Excel 路径无效等，用错误红文字提示，并配合明确文案。
+
+限制：
+
+- 颜色不能作为唯一信息来源，必须同时显示明确文字，例如 `失败`、`等待超时`、`不明显`。
+- 不使用闪烁、背景大色块或字号放大来表达普通等待状态；失败/警告也应控制在文字、图标或小徽章范围内。
+- 已经有进度条的区域，颜色只补充最终状态或异常状态，不再额外制造第二套“进度百分比”。
+- 状态色应集中封装为样式或 helper，避免同一个状态在不同面板使用不同色值。
+
 字体：

 ```text