Penpot：面向设计与代码协作的开源设计工具
Penpot 是一款面向设计与开发团队的开源设计平台，旨在弥合设计师与工程师之间的协作鸿沟。它基于 Clojure 和 ClojureScript 构建，采用 Mozilla 公共许可证 2.0（MPL-2.0），支持浏览器直接使用或自托管部署，确保团队对设计基础设施拥有完全的控制权，满足严格的安全与合规需求。Penpot 使用 SVG、CSS、HTML 和 JSON 等开放标准，使设计天然以代码形式表达，开发者能直接从中提取样式与结构，加速产品交付。其核心功能包括实时协作、原生设计令牌（Design Tokens）实现设计与开发间单一事实来源、CSS Grid 与 Flex 布局支持响应式界面设计，以及通过 MCP 服务器和开放 API/插件系统实现可编程工作流，支持自动化、AI 驱动流程与现有工具集成。这些特性使 Penpot 成为构建可扩展设计系统与全栈产品开发流程的理想选择，特别适用于需要强化设计治理、提升跨团队协作效率的组织。
💡 应用场景
Penpot最适合需要开源、可自托管、强调设计与代码无缝衔接的团队，尤其适合对数据主权有要求或希望自动化设计流程的开发者。
设计稿转代码
问题：设计师用Figma等工具出图后，开发者手动还原UI细节，沟通成本高且易出错。
方案：Penpot原生支持SVG/CSS/HTML导出，开发者可直接从设计稿中复制代码，减少手工转换。
示例：前端拿到Penpot中的按钮设计，直接复制CSS样式代码应用到React组件，无需反复对照设计稿调整像素。
自建设计系统
问题：团队需要统一UI组件规范，但商业工具（如Figma）有授权限制，无法完全掌控数据。
方案：Penpot支持自托管和设计令牌（Design Tokens），可创建可复用的样式变量，确保设计系统一致性。
示例：团队在内部服务器部署Penpot，定义颜色、间距等设计令牌，所有组件引用这些令牌，修改令牌即可全局更新UI。
实时协作原型
问题：远程团队需要多人同时编辑设计原型，但传统工具协作体验差或需要付费。
方案：Penpot提供实时协作功能，多人可同时在线编辑同一设计文件，且完全开源免费。
示例：产品经理、设计师和开发者在同一画布上实时调整页面布局，即时看到对方修改，减少等待和沟通时间。
自动化设计流程
问题：设计到开发的流程中，重复性工作多，缺乏与CI/CD或AI工具的集成。
方案：Penpot提供开放API和MCP服务器，支持插件系统和AI工作流，可自动化导出、校验或生成代码。
示例：开发团队编写脚本，通过Penpot API自动导出每次设计迭代的SVG资源，并提交到Git仓库，实现设计变更自动同步。
📊 项目信息
- 语言
- Clojure
- Stars
- ⭐ 48,806
- Forks
- 3,120
- 今日新增
- +53
- 排名
- #1
- 收录
- 语言榜
- 趋势日期
- 2026年6月2日
- 最后推送
- 2026/6/2
🏷️ 标签
📸 截图
