跳转到内容

设计与体验 · DEFINED TERM

颜色与对比度

颜色表达品牌和状态,对比度确保文字与控件看得清。

你可能会这样说“浅色背景上的文字不能淡到看不见”

VISUAL EXAMPLE

先看懂它怎么工作

MECHANISM

运行机制

  1. 选择语义色
  2. 计算前景背景差异
  3. 覆盖交互和状态

USE WHEN

适合这样用

区分操作、状态、层级并保障可读性

NOT FOR

不要这样理解

不要只用颜色表达错误或选中状态

TELL YOUR AGENT

可直接发给 Agent

请按“颜色与对比度”的概念处理这个需求:浅色背景上的文字不能淡到看不见。先说明实现边界,再给出可检查的结果。

ACCEPTANCE

怎么确认它真的做好了

正文和控件达到可读对比,状态还有文字或形状线索

OFFICIAL SOURCES

官方来源