怎么用一个品牌色生成色彩系统？

输入主色，工具生成 primary、accent、neutral 的完整 11 步色阶和语义 Token，可用于 CSS 和 Figma。

什么是语义颜色 Token？

把颜色按角色而非外观分配——如 primary、surface、danger——这样改 Token 就能换肤，而不必改每个元素。

中性色会略微染向品牌色相，让灰色与色板协调，而不是平淡脱节。

输入一个颜色，系统自动推算完整设计变量体系

选色

Accent 关系

Neutral 色调

对比强度

色阶系统

点击任意色阶查看详情，每组均含 50–950 共 11 个阶位

设计 Token

可直接复制到 CSS 或 Figma Variables 的语义变量

界面预览

验证 Primary / Accent / Neutral / Surface 在真实界面中的层级与可读性

品牌色系生成器，输入主色自动构建含主色、辅助色、强调色、中性色四套11步色阶和完整语义Token的品牌色彩系统，适合品牌规范。只需输入一个品牌主色，系统会自动推算出配套的辅助色、强调色和中性色阶，省去逐个手动调配色阶的时间。

适合品牌刚定下主色调、还没有完整色彩规范的阶段，一次生成就能拿到可以直接写进品牌手册的完整色彩系统。

怎么用一个品牌色生成色彩系统？ 输入主色，工具生成 primary、accent、neutral 的完整 11 步色阶和语义 Token，可用于 CSS 和 Figma。
什么是语义颜色 Token？ 把颜色按角色而非外观分配——如 primary、surface、danger——这样改 Token 就能换肤，而不必改每个元素。
中性色是怎么选的？ 中性色会略微染向品牌色相，让灰色与色板协调，而不是平淡脱节。