用Kigen其实超简单!直接在Figma插件商店搜索安装就行了,有免费版也有Pro版。
基础使用流程:
高级技巧:
Pro版本提供了更多预设模板和自定义选项。你可以根据品牌需求调整基础色彩,插件会自动生成对应的语义化变量集合。特别适合团队协作,因为生成的变量可以直接同步给整个设计团队使用。
不用从零开始思考变量命名和结构,几分钟内就能建立完整的设计系统基础。特别适合刚开始做设计系统的团队。
集成了Material、Fluent、Tailwind、Polaris等知名设计系统的调色板,经过实战验证的配色方案直接拿来用。
自动生成Success、Error、Warning等语义化别名,确保设计的一致性和可访问性,再也不用为变量命名发愁。
提供标准化的字体大小、行高、字重等规范,让整个产品的文字样式保持统一专业的视觉效果。
支持导出JSON、CSS等多种格式,方便开发者直接使用。文档详细清晰,团队协作无压力。
团队在持续优化产品,定期添加新功能和设计系统模板,跟上行业最新趋势和最佳实践。
对于刚开始建设设计系统的团队,Kigen能帮你在几分钟内建立起标准化的变量基础架构,省去大量前期研究时间。
基于成熟的设计系统模板,快速制定符合品牌调性的视觉规范,确保整个产品的视觉一致性。
为设计团队提供统一的变量命名和使用规范,避免各自为政导致的样式混乱和维护困难。
新项目启动时不用再重新思考基础的设计变量,直接用Kigen生成标准化的设计基础,快速进入核心设计阶段。
生成的变量可以直接导出为文档格式,方便与开发团队沟通和项目交接,减少理解偏差。
很多配色网站提供配色方案的时候,缺乏提供相应的场景实例,往往设计师参考色板最终的输出的视觉方案并达不到预期。这个网站提供了大量的参考和案例演示,可以帮助设计师快速的查找和验证配色方案。
Pattern Craft 一个现代化的背景图案和渐变代码片段库,提供超过 100 种专业级的背景模式。基于 CSS 和 Tailwind,允许用户轻松复制和集成模式到自己的项目中。完全免费。
Paletton 是一个基于传统 RYB 艺术色轮的专业配色工具,支持单色、互补、三元等经典色彩结构,自动生成五级明度,并内置 WCAG 对比度检测与八种色盲模拟。适合品牌、印刷及无障碍 UI 设计,完全免费,无需登录。
ColorAI 从真实图片(如电影、自然、艺术)中提取配色,并标注文化主题与情绪感受。设计师无需懂色彩理论,也能快速找到有叙事感、符合场景氛围的调色板,一键导出 CSS/Tailwind,免费无广告。