用自然语言让AI帮你画UI：Penpot+MCP设计神器

做 UI 设计，你还在来回改稿改到崩溃吗？

每次跟设计师沟通，都像在玩”你画我猜”——你说”这里再活泼一点”，对方给你整出荧光绿配粉红。你说”简约一点”，结果得到一个空白页面。

现在，AI 可以直接帮你做 UI 了。而且不是那种”生成一张图你自己看着办”的敷衍操作——是真的能出可编辑、可导出的专业设计稿。

Penpot + MCP：设计圈最新的王炸组合

Penpot 是一个开源设计工具，支持团队协作，而且是基于浏览器的——不用装软件，直接打开网页就能用。最近他们出了 MCP（Model Context Protocol）服务器，把 Penpot 的能力直接接入了 AI Agent。

这意味着什么？

你可以用自然语言跟 AI 说：”帮我设计一个仪表盘，要有用户统计、销售漏斗、还有最近活动列表。”AI 就会直接在 Penpot 里给你把整个界面画出来——不是图片，是可以编辑的图层、组件、文字。

想要改？直接说：”把导航栏换成暗色主题”，AI 立刻帮你改。

这个 Skill 解决了什么问题

GitHub 官方 awesome-copilot 仓库里收录了一个 penpot-uiux-design Skill，专门教你如何用 MCP 工具在 Penpot 里做专业 UI/UX 设计。

它能帮你：

• 创建网页端、移动端、桌面端界面设计
• 构建设计系统（组件库、Design Token）
• 设计仪表盘、表单、导航、着陆页
• 遵循无障碍标准（对比度、触控区域）
• 遵循平台规范（iOS、Material Design）

怎么用

前提：你得先装好 Penpot MCP 服务器。

步骤很简单：

1. 克隆 penpot-mcp 仓库并安装依赖
2. 在 Penpot 里加载插件，连接到 MCP 服务器
3. 然后你就可以用自然语言让 AI 帮你画界面了

AI 会先分析你的需求，确定设计方案，然后用 Penpot 的 API 在画布上把东西一个个创建出来。你甚至可以让它先显示设计系统（颜色、字体、组件），确认满意了再动手。

谁适合用

如果你是：

• 产品经理，需要快速出原型
• 创业者，想自己搞定产品界面
• 开发者，想在代码里先有设计稿
• 设计师，想用 AI 提效

这个 Skill 都值得试试。设计不再是设计师的专属技能树了。

GitHub 链接：https://github.com/github/awesome-copilot/tree/main/skills/penpot-uiux-design

GitHub: https://github.com/github/awesome-copilot/tree/main/skills/penpot-uiux-design