PassNAT LogoPassNAT

开源设计协作平台 Penpot 自托管部署指南,NAS 一键启动轻松建立私人设计工具

作者

小编

发布时间

Curving abstract shapes with an orange and blue gradient

Penpot - 开源设计协作利器

项目介绍

Penpot 是首款真正意义上的开源设计工具,专为设计师和开发者的协作而生。它基于现代网络标准(SVG、CSS、HTML 和 JSON)构建,提供了一个功能完整的设计与原型开发平台,完全免费且支持自托管部署。

与传统设计工具不同,Penpot 将设计表达为代码,让设计师能够创作精美的设计、交互原型和大规模设计系统,同时开发者可以直接获取可用的代码,实现真正的设计-代码无缝协作。Penpot 2.0 版本带来了革命性的 CSS Grid 布局功能、全新 UI 设计、Components 系统升级等众多特性,让协作流程更加高效。

无论是使用官方云服务还是自托管部署,Penpot 都能为你的团队提供一个完全可控的协作设计平台。

项目地址:https://github.com/penpot/penpot


部署安装

如果你需要在外网访问自托管的 Penpot 实例,建议配置内网穿透服务。可以考虑使用 帕斯内网穿透 这类解决方案,先注册账号后备用。具体的配置方法可参考 内网穿透全平台操作指南,让你随时随地都能访问自己的设计工具。

最快速上手方案(Docker Compose)

Penpot 官方提供了开箱即用的 Docker Compose 配置,这是最推荐的部署方式。

第一步:获取配置文件

打开你的 NAS 设备或 Linux 服务器,执行以下命令下载官方 docker-compose 文件:

1wget https://raw.githubusercontent.com/penpot/penpot/main/docker/images/docker-compose.yaml

或者使用 curl:

1curl -o docker-compose.yaml https://raw.githubusercontent.com/penpot/penpot/main/docker/images/docker-compose.yaml

第二步:启动服务

下载完成后,使用以下命令启动 Penpot:

1docker compose -p penpot -f docker-compose.yaml up -d

就这么简单!Penpot 会自动在后台运行,并监听 `http://localhost:9001`

第三步:访问应用

等待容器完全启动(通常需要 1-2 分钟),然后在浏览器中访问:

1http://你的服务器IP:9001

第一次访问时,你需要注册一个账号或使用演示账户登录。


通过 NAS 管理界面部署

如果你使用飞牛 NAS 或其他支持 Docker 的 NAS 设备,也可以通过图形界面部署:

1. 添加镜像

打开 NAS 的管理后台 → 本地镜像 → 添加镜像 → 从 URL 添加

镜像地址填写:`penpot/penpot:latest`

等待镜像下载完成。

2. 配置容器

点击启动按钮后,进入配置页面:

开机自启:建议勾选,这样重启 NAS 后 Penpot 会自动运行

端口映射:

容器内部端口:`9001`

主机端口:`9001`(如果 9001 被占用,可改为其他端口如 8080,但容器内部端口必须保持为 9001)

存储映射:Penpot 需要持久化存储用户数据和上传的文件

在 NAS 上创建一个文件夹(如 `/mnt/data/penpot`)

将其映射到容器内的 `/penpot/data` 目录

3. 环境变量配置

以下是可选的环境变量设置(大多数情况下使用默认值即可):

环境变量 | 说明 | 默认值 | 是否必需

`PENPOT_VERSION` | Penpot 版本 | latest | 可选

`PENPOT_FLAGS` | 高级功能标志 | 空 | 可选

`PENPOT_HTTP_SERVER_MAX_BODY_SIZE` | 最大上传文件大小 | 31457280 | 可选

大多数用户无需修改这些变量,保持默认即可。

4. 完成部署

点击'下一步'或'启动'按钮,容器将开始运行。

等待 1-2 分钟,容器完全启动后,访问 `http://NAS的IP:9001` 即可开始使用 Penpot。


更新 Penpot

当有新版本发布时,更新非常简单:

1docker compose -f docker-compose.yaml pull
2docker compose -p penpot -f docker-compose.yaml up -d

第一条命令拉取最新镜像,第二条命令重新启动容器。


备份你的数据

Penpot 使用 Docker 卷来存储所有数据。定期备份很重要:

1docker run --rm --volumes-from penpot-penpot-postgres-1 -v $(pwd):/backup ubuntu tar czf /backup/penpot-backup.tar.gz /var/lib/postgresql/data

这会将数据库备份到当前目录。


核心功能亮点

✨ 实时协作设计 - 多人同时编辑同一个设计文件,实时同步更新

🎨 完整的设计系统 - 原生支持设计令牌(Design Tokens)、组件库和变体管理

💻 开发者友好 - 检查模式下直接获取 SVG、CSS 和 HTML 代码,无需手工转换

🔌 插件生态 - 通过插件系统扩展功能,集成第三方工具和自定义解决方案

🚀 原型和交互 - 创建交互式原型,验证设计想法

📦 设计资源库 - 内置模板库和资源库,加速设计工作流

🔒 完全可控 - 自托管部署,数据完全掌握在自己手中


总结

Penpot 为设计师和开发者提供了一个真正开放、协作、高效的设计平台。无论你是个人设计师、小型创意团队,还是大型企业,Penpot 都能满足你的需求。通过 Docker 部署,你可以在几分钟内拥有一个完全属于自己的设计工具,无需担心数据隐私和成本问题。

立即开始你的 Penpot 之旅吧!