设计原则 / Contrast
Contrast
通过颜色、明度、尺寸、字重、形状、空间或运动差异，使元素之间产生清楚区分。
关键字段
What · 是什么
- 定义
- 通过颜色、明度、尺寸、字重、形状、空间或运动差异，使元素之间产生清楚区分。
Why · 为什么
- 核心问题
- 元素之间是否有足够且有语义的差异，让用户能区分层级、状态和功能？
- 作用机制
- 对比提高目标与背景之间的可分辨性，使用户更快发现边界、层级和状态。对比维度越多，视觉竞争越强，系统越需要限制强调范围。
How · 怎么做
- 主要用途
- 建立层级、突出重点、提升可读性和状态辨识度。
- 设计指导
- 先明确需要区分的语义，再选择少量对比维度；正文与背景同时检查可读性和无障碍对比度。
Evidence · 证据
- 局限与边界
- 对比不只是改颜色，差异过多会制造噪声；颜色对比不能替代文字、形状和位置线索，还必须满足可读性与无障碍要求。
- 最后验证时间
- 2026-08-21
- 常见错误
- 对比不是只改颜色；差异越大不一定越好；颜色对比不能替代标签和形状线索。
Lifecycle · 生命周期
- 状态
- 待复核
相关要素与机制
这条内容目前没有关联内容。
暂时没有可展示的关系内容。