Penpot

开源设计平台——大规模数字产品团队的设计基础设施完全自主

更新于 2026-08-10

一句话定位

设计即代码、自托管、开放标准的 Figma 替代

面向「规模化构建数字产品」的团队。浏览器使用或部署在自己服务器，工作于 SVG/CSS/HTML/JSON 开放标准；设计以代码表达，开发者与 AI（经 MCP server）都能读懂；Design Tokens 提供设计与开发之间的单一事实源。Kaleidos（西班牙）公司项目，认证数字公共产品（DPG）。

核心数据

部署无关：官方 SaaS（design.penpot.app）或自托管（Docker / Kubernetes / Elestio）。MPL-2.0 许可，社区 + 大使计划 + 多语言翻译生态。

设计基础设施的所有权问题

代码化方法（Code-Based Approach）

Penpot 通过代码化方法连接设计、代码与 AI 工作流——设计以代码表达，开发者与 AI 都能读懂，设计与开发之间的翻译损耗降到最低。

• Inspect 模式：inspect 标签即时给出 SVG/CSS/HTML 代码，开箱即用
• 原生 Design Tokens：设计系统一致性 + 跨项目复用，单源同步
• CSS Grid / Flex 布局：从设计阶段就按真实代码的响应式规则工作

MCP Server：设计与代码双向工作流

Penpot 的 MCP server 让 AI Agent 直接读写设计——设计被 AI 当作数据消费，实现设计→代码、代码→设计的自动化双向流程。

配套 Penpot Hub 插件市场扩展平台能力；webhooks + API 让设计进入开发工具链。

面向代码团队的 Design Systems

起步

# 方式一：官方 SaaS（零部署）
打开 https://design.penpot.app 注册即用

# 方式二：Docker 自托管（部署无关）
git clone https://github.com/penpot/penpot.git
cd penpot
docker compose -f docker-compose.yaml up -d   # 详见官网 self-host 文档

# 方式三：Kubernetes / Elestio 等
部署到任意基础设施，数据全在你自己手里

文档：User Guide / Learning Center / Architecture（技术指南），YouTube + Peertube 视频教程，社区论坛答疑。

谁适合用

需要警惕

• 生态成熟度差距：相比 Figma 的插件市场与模板库，Penpot Hub 仍在成长期
• 功能落差：原型制作与高级协作功能与商业竞品有差距，部分团队需妥协
• 自托管运维成本：Docker/K8s 部署 + 升级维护需要工程投入，小团队未必划算
• AI 工作流早期：MCP server 双向流程是卖点也是实验性功能，稳定性待观察
• 许可证条款：MPL-2.0 对文件级修改有公开义务，重分发场景需留意

未来空间

Figma 被 Adobe 收购案后「开源 Figma 替代」叙事长期成立；而「设计即代码 + MCP + Design Tokens」的组合在 Agent 时代有结构性优势——设计资产成为 AI 可直接消费的数据，这是商业设计工具没有的位置。