关于设计 tokens
- 设计 tokens是给 UI 设计决策(颜色、间距、字体等)命名的值
- CSS 自定义属性(CSS 变量)让你能在样式表中引用这些 tokens
- 本工具按品牌色生成色阶(50、100、...、900),并通过等间距明暗调整生成
- 同时输出一致的间距、字号、圆角、阴影 tokens
输出格式
- CSS 自定义属性:
:root { --brand-500: #3b82f6; } - SCSS 变量:
$brand-500: #3b82f6; - Less 变量:
@brand-500: #3b82f6; - JSON Tokens:用于 Style Dictionary、Figma Tokens 等工具