主题色导出
主题色令牌导出为 CSS/Tailwind/SCSS/JSON,生成在浏览器本地完成,数据不会上传。
主题色令牌
使用说明
做主题或设计系统时,常需把一组颜色导出成不同格式。本工具维护主题色令牌,可从一个主色生成色阶,并导出为四种常用格式。
- 选择主色,点击「从主色生成 50-900 色阶」快速铺开一套色板,或手动添加单个颜色。
- 为每个令牌设置名称与颜色,右侧会同步显示预览色块。
- 选择导出格式(CSS / Tailwind / SCSS / JSON),复制或下载结果。
常见问题
- 色阶是怎么生成的?
- 保持主色的色相与饱和度,按明度从浅到深插值得到 50 到 900 的色阶,方便做深浅搭配。
- 导出的 Tailwind 配置怎么用?
- 把生成的 colors 合并进 tailwind config 的 theme.extend.colors,即可用类名引用这些颜色。