Design System Generator
按钮组件集生成器
.png)
✏️ 介绍
这是一款用于快速搭建设计系统的 Figma 插件，重点帮助你自动生成颜色体系、Button Components，以及对应的前端代码。它可以根据基础颜色和按钮规范，一键生成完整的 Variables、Styles、Variants 和 React / CSS 代码，适合设计系统搭建和设计开发协作。
🔨 功能
1. 支持从预设色板选择颜色，也可匹配现有设计系统颜色 2. 可自定义按钮圆角、字体、尺寸和样式 3. 支持自适应尺寸、Padding 和灵活宽高 4. 提供按钮实时预览，生成前可先检查效果 5. 一键生成 48 种 Button Variants 6. 支持 Small、Medium、Large 三种尺寸 7. 支持 Primary、Secondary、Text、Elevated 四种按钮类型 8. 支持 Enabled、Hovered、Pressed、Disabled 四种状态 9. 所有按钮默认支持 Auto Layout 10. 自动将 Color Variables / Styles 绑定到按钮组件 11. 支持一键导出 CSS 和 React 代码 12. 支持 WCAG Color Contrast 对比度检查 13. 可根据一个 Base Color 自动生成完整颜色设计系统 14. 支持生成类似 Tailwind CSS 的颜色层级和 Variables 15. 支持 Light / Dark Mode 配色体系 16. 已生成的 Design System 可重新选中并继续编辑 17. 插件界面支持 Light / Dark Mode
.png)
.png)
.png)
.png)
.png)
.png)
