设计令牌（Design Token）把颜色、字体、间距、圆角、阴影等设计决策抽象成变量，样式层不再硬编码。改一个令牌，全局联动，这就是主题可控的根基。
品牌化不是把所有颜色换成品牌色，而是建立一套与品牌气质一致的设计令牌组合。
核心理念：颜色不写死在组件里，只引用令牌。全局一致性与换肤能力都来源于此。
一套成熟主题系统应支持的能力。
一键切换品牌主题/暗黑模式。
单个组件也可独立覆盖令牌。
不同断点下的视觉微调。
自动/手动切换，语义色联动。
多主题按需构建，减小体积。
令牌保证关键对比度达标。
从现状到可维护主题体系的路径。
盘点硬编码颜色与组件样式，找出需要抽离的变量。
定义语义化令牌命名（如 color-primary、spacing-md），形成设计规范。
逐步把硬编码替换为令牌引用，验证全局一致与回归无破坏。
支持暗黑模式与品牌主题切换，建立主题覆盖机制。
不同规模下的主题管理方式。
| 方案 | 适合规模 | 优点 | 缺点 |
|---|---|---|---|
| CSS 变量 | 中小项目 | 原生、零依赖 | 复杂逻辑需配合 JS |
| SCSS 变量 | 构建项目 | 编译期确定 | 运行时换肤不便 |
| CSS-in-JS | 组件化项目 | 动态主题强 | 运行时开销 |
| 设计令牌体系 | 多端多主题 | 规范统一 | 初期建设成本高 |
关键在语义色而不是固定色。用语义令牌（背景/前景/边框）而非绝对颜色，暗黑模式只是令牌值的一整套切换。
会，这正是设计令牌的价值：只改主色令牌，全局自动联动，替换成本趋近于零。
主题系统就是设计规范的可执行版本。让设计与开发共用同一套令牌定义，从源头避免偏差。
按需生成主题产物、去除未使用变量，配合构建工具的 tree-shaking 与拆分。
