用途:figma-design-md-generator 是一个 Figma 插件,读取当前 Figma 文件中的本地样式、变量和组件族,生成 DESIGN.md(供人阅读的设计参考文档)与 SKILL.md(面向 AI 智能体的实现规则),让 AI 编程工具在构建界面时遵循一致的设计系统。
主要能力:自动提取颜色令牌(绘制样式与变量)、排版令牌(文本样式与比例)、间距/圆角/动效令牌、效果样式(阴影、模糊)、网格样式以及组件族;生成可人工编辑的 DESIGN.md 与面向 AI 优化的 SKILL.md;支持在编辑器内切换两种视图、刷新重新提取、下载为 .md 文件。
使用方式(开发模式):
git clone https://github.com/bergside/design-md-figma.git cd design-md-figma
npm install
npm run build
随后在 Figma Desktop 中通过 Plugins → Development → Import plugin from manifest... 选择项目中的 manifest.json,再从插件菜单运行 Design MD Skill Generator。开发时可使用 npm run watch、npm run typecheck。
适用场景:设计系统较为成熟、希望让 AI 辅助编码时严格复用设计令牌与组件变体的团队。可将生成文件置于项目根目录,并引用 SKILL.md 作为智能体上下文。
限制:插件只提取当前文件的本地样式与本地变量集合,不提取共享库中的样式;若输出为空,需确认文件中已创建本地样式。仅描述资料中明确的功能,收费、价格与平台支持范围暂未提供。