设计系统术语表

支撑设计系统工作的那套词汇，用平实的话讲清楚。这些词条讲的是这个领域本身而不是产品，所以即使你从不打开 Flash DSM 也用得上。

从设计到代码

从设计到代码指的是把在 Figma 等工具里做出的决定变成可运行的前端代码。真正耐用的做法是传递设计 Token，而不是从画布生成标记：界面改变时 Token 依然有效，生成的标记则不然。

色阶是同一色相下按顺序排列的一组明暗层级，通常编号从 50 到 900。它要做到每一档在视觉上间隔均匀，并让特定搭配满足已知的对比度要求，从而让团队按角色和档位选色，而不是随手挑一个十六进制值。

设计 Token 是一个带名字的值，用来保存单个设计决定，例如一种颜色、一个间距档位或一个字号。给决定起了名字，就能在设计工具和代码里重复使用，而不必在每个地方手写一遍。

设计系统是一个团队为了一致地构建产品而共享的设计决定、组件与规则的集合。它通常包含设计 Token、组件库、使用规范和文档，并作为设计与代码共同的唯一事实来源来维护。

深色模式 Token 是绑定到与浅色主题相同语义名称上的第二套取值。切换模式时，--color-surface 这样的名称会指向另一组颜色，而任何组件都不需要知道当前处于哪个模式。

Model Context Protocol 是把 AI 助手接到外部工具和数据的开放标准。用在设计 Token 上，MCP 服务器会把项目当前的 Token 取值提供给 AI 编码代理，让生成的组件引用真实的设计系统，而不是模型自己编出来的数值。

语义 Token 是按用途命名而非按取值命名的设计 Token，例如用 --color-text-danger 而不是 --color-red-600。它通常引用一个基础 Token，因此可以更换底层取值，而无需改动任何引用它的地方。

字号阶梯是设计系统允许使用的一组有序字号，通常由一个基准字号乘以固定比例生成。把文字限制在这些档位上，正是多人协作的界面能保持排版一致的原因。

Figma 变量是保存在 Figma 文件里的具名值，支持颜色、数字、字符串和布尔值，并可为浅色和深色等场景设置模式。它是 Figma 原生的设计 Token 形式，但要通过 Figma REST API 读取则需要 Enterprise 套餐。

Token 漂移是指设计系统里记录的决定，与产品实际使用的取值之间逐渐拉开的差距。当某个界面来源不再引用共享源头，转而积累自己的取值时就会发生，比如一个 Figma 文件、一份样式表，或是 AI 生成的代码。