1. 为什么“开源替代 Figma”这个话题突然热了起来作为从 Sketch 时代一路用过来的设计师我能明显感觉到这波“开源替代”的热度跟以前完全不是一个量级。以前大家聊开源设计工具基本属于围观状态嘴上说着支持开源手上还是老老实实开着 Figma毕竟当时的开源工具连“能用”都费劲。但从 2024 年下半年开始风向明显变了。设计社区里开始出现把 Penpot 自托管到生产环境的团队也有大量人在问“Figma MCP 的 token 在哪里获取”“Figma MCP 怎么接入 Trae 和 Codex”这类问题。你随便搜“Figma、开源设计工具”这两个关键词都能看到无数篇对比帖、迁移教程和踩坑笔记。这种变化背后有三个直接原因。第一Figma 的商业化节奏明显在加快体现在席位配额管理、权限分级、Dev Mode 独立计费等细节上免费版能用的东西越来越少团队要花的钱越来越多。第二AI 编程工作流把设计文件的地位给改了。设计稿不再只是给人看的“效果图”而是给 AI 模型读的“图纸”。设计工具是否开放 API、数据能不能被程序化访问已经从加分项变成了硬指标。第三Penpot 这类开源工具在核心技术上完成了关键突破尤其是对 CSS Grid 布局的原生支持和成熟的自托管方案让“不用 Figma”这件事第一次在技术层面变得可行。1.1 先说结论开源工具不是 Figma 的“平价替身”直接给结论省得大家绕圈子如果你只用设计工具来画界面、做原型、出切图那么 Penpot 已经完全能覆盖 Figma 大概七成的日常场景。但如果你还需要深度使用插件生态、Figma Community 模板、Dev Mode 的标注交付、复杂原型动效以及官方成熟的 MCP 接入能力开源工具暂时还补不上这些缺口。所以这篇文章的标题虽然叫“要不要放弃”但我的立场从来不是“必须换”或者“坚决不换”。我更想帮你做一次实在的评估你的业务模式、团队协作方式、开发交付链路到底有多少是绑在 Figma 生态上的这些绑定的价值有没有高于迁移到开源工具之后拿回的数据自主权和成本节省。1.2 为什么是 2025 年而不是三年前三年前我试用 Penpot 的时候它的状态可以用“方向对了但还很粗糙”来形容。界面卡顿、组件系统薄弱、多人协作时偶尔还会丢操作那时候劝人放弃 Figma 改用它纯属不负责任。但现在的 Penpot 已经是另一套底子了自托管 Docker 镜像做得很稳SVG 底层让它在缩放和导出时保真度很高CSS Grid 原生布局引擎也让设计稿转前端代码的还原度有了结构层面的保障。更重要的是工具选型的外部环境变了。AI 编程工具链发展得飞快过去那种“设计完切图、标注、写交互说明、开发照着还原”的流程正在被“AI 直接读设计稿、生成代码、人工 review”的新模式替代。在这种情况下设计工具支持不支持 MCP、API 权限好不好拿、数据能不能灵活进出就变得异常关键。Figma 提供了官方 MCP 服务器这一步走得很快但平台属性也带来了 token 维护、调用限制、按等级开放功能这些新问题。开源工具虽然默认没有现成的 MCP 服务但数据完全由自己掌控接口自由度反而更高更适合做定制化的 AI 工作流。说白了现在大家考量的早已不是“哪个软件画图快”而是“我的设计资产放在哪个平台上最安全、最可控、最便宜”。2. 开源替代阵营里谁真正有资格跟 Figma 掰手腕2.1 Penpot开源阵营里唯一的“主场选手”Penpot 是目前唯一值得认真评估、有实力跟 Figma 正面比较的开源 UI 设计工具。它是 Web 原生的这点跟 Figma 一样浏览器打开就能用但比 Figma 多了一条关键路径可以通过 Docker 自托管到自己的服务器、NAS甚至只部署在团队内网里。这一点对于设计资产敏感、有数据合规要求的团队来说是本质性的区别。它的开源协议是 MPL 2.0。简单理解你可以在自己的项目里自由使用、修改、二次分发它的代码甚至拿它做商用只要保留版权声明、开源你基于它修改过的部分即可。换句话说你不仅是在“用”一个工具如果你想你还能成为这个工具演进的一部分。这一点跟 Figma 那种封闭的 SaaS 模式完全是两套哲学。功能层面Penpot 这几年补课补得非常扎实。组件和变体Components Variants在 2.0 之后已经完全可用样式Styles支持颜色、字体、效果这些复用原型连线可以配置交互、动效和触发器多人实时协作只要服务器带宽充足体验已经接近“稳定可用”。它最值得一提的还是 CSS Grid 布局引擎在 Figma 里做自适应设计靠的是 Auto Layout虽然好用但它跟前端真正用的 Flexbox、Grid 之间始终隔着一层“翻译”。Penpot 直接让设计师在设计稿里使用真实的 CSS Grid 来排布元素研发还原时几乎不需要额外解释“这个间距在代码里怎么写”。对于设计交付给开发这一步开源工具第一次不是“模仿者”而是在某些维度上给出了更贴近工程实践的答案。2.2 其他开源“备胎”的真实水平Penpot 之外我偶尔也会看看其他免费或开源工具每个工具都有自己的适用场景但也都存在明显的边界。Lunacy 是 Windows 平台上体验相当不错的免费 UI 设计工具由 Icons8 团队维护。它的界面和操作逻辑与 Figma 高度相似老 Figma 用户切换成本极低而且内置了丰富的图标、插画和 UI 套件资源。缺点在于它不是完全开源的项目开源程度有限协作能力更多依赖本地网络或第三方存储。如果你的团队全是 Windows 工作机又不太在意自托管这件事Lunacy 可以作为比 Penpot 更平滑的过渡选择。Akira 当初被看作“Linux 上的 Figma 希望”开发方向是原生矢量设计器但项目现在已经基本停止活跃维护只能当研究性的学习工具来玩不建议进入生产环境。Inkscape 是老牌 SVG 编辑工具做图标、插画、复杂路径编辑非常能打但它的底层逻辑是“文档式绘图”不是“组件化 UI 设计”拿它画界面会非常别扭。适合做图形资产的补充工具不适合做主力 UI 设计平台。所以结论很直接讨论开源替代这件事时真正能跟 Figma 放上同一张桌子的只有 Penpot再加半个 Lunacy。2.3 一张表看清核心差异对比维度FigmaPenpotLunacy授权模式商业 SaaS订阅制开源MPL 2.0可自托管免费使用开源程度有限运行方式网页 桌面客户端网页 Docker 自托管Windows 桌面为主多人协作成熟稳定可用依赖服务端性能支持但生态较弱布局逻辑Auto Layout 约束原生 CSS Grid / Flexbox传统自由布局插件体系数千个高质量插件插件生态刚起步内置资源为主MCP / AI 集成官方 MCP文档完善可自建接口DIY 空间大基本没有现成方案中文本地化无官方中文靠插件多语言社区支持内置中文免费额度免费版限制多无功能墙桌面版基本免费这张表不是在说“谁赢谁输”而是让你看清楚一个本质Figma 卖的是“生态和体验”开源工具给的是“自由和所有权”。你要选择的不是工具而是这两种东西在你的工作流里分别值多少钱。3. 放弃 Figma 的得与失算一笔明白账3.1 你会失去的不只是“少几个插件”那么简单很多人觉得放弃 Figma 最大的损失是“插件少了”其实这只是最表面的。真正的损失藏在这三个看不见的地方里。第一个是设计资产的流动性。在 Figma 里躺了三四年的大量项目文件尤其是那些加了复杂变体、组件库、交互原型、团队 Library 的复杂文件导出后并不是一个干净的通用格式。你虽然能导出 SVG、PDF 保底但文件里的图层结构、命名规范、组件关系全部丢失。到了新工具里你面对的是被“拍扁”的图层和一团乱的命名得手动重建组织关系。这种“负重迁移”的时间成本被很多人严重低估。第二个是团队协作的肌肉记忆。你们团队可能早就习惯了在 Figma 里开评论、圈一下相关人、然后在 FigJam 里贴便签做快速头脑风暴。这些流程看上去不起眼但已经长进了组织的日常节奏。换工具后这些流程要么在开源工具里用不同的方式重新实现要么暂时拿网盘加白板工具拼凑体验落差会在切换后的前两周被无限放大。第三个是 Dev Mode 的成熟度。Figma 的 Dev Mode 迭代了这么多版本切图标注、间距尺寸、CSS 代码生成、设计变量导出整套链路相当顺滑。开源工具目前做不到同等体验Penpot 的设计标注面板能给出基础的 CSS 信息但完整度和工程化程度跟 Dev Mode 之间仍有明显距离。3.2 你会得到的数据所有权与自由度说完失去的再来说得到的。最核心的一项是数据所有权。用 Figma 时你的设计稿存在 Figma 的服务器上哪天账号出问题、服务变动或者政策调整你连打包跑路都得看平台脸色。换成 Penpot 自托管文件数据完全掌控在自己手里。设计稿是公司最核心的数字资产之一数据在谁手上话语权就在谁手上。第二项是费用透明。Figma 的订阅成本是“席位 功能 企业版”一层层叠上去的Penpot 自托管的主要成本是服务器硬件和运维时间云端版也有免费档不存在“核心功能锁在付费墙后面”这种事。对于十个人以内的设计团队自托管 Penpot 一年的综合成本很可能还不到一个 Figma 专业版席位一年的订阅费用。第三项是定制能力。开源意味着你可以改它的源码、写自己的插件、对接自己的内部系统。大多数团队未必会直接去改框架源码但“万一需要”的选择权本身就有价值。尤其当团队在搭建 AI 工作流想给设计工具加定制接口时开源项目的可塑性就是最核心的竞争力。3.3 费用之外还有两笔账必须算一笔是迁移时间账。我见过不少团队兴冲冲部署了 Penpot把 Figma 文件导入后却发现布局全乱最后花了两周手动重建核心设计系统。我的建议是迁移前一定先拿非核心项目试水完整跑一遍“导出—导入—重建—出图给开发”的流程量化真实耗时再决定要不要全面切换。另一笔是团队学习账。Figma 和 Penpot 虽然交互逻辑相似但 Penpot 的 CSS Grid 思维和 Figma 的 Auto Layout 思维在底层的设计逻辑上并不相同。老设计师转换一般需要一到两周习惯旧逻辑的人很容易在头几天对着新工具各种不顺手。最终决定切换前一定把学习成本也算进去不然很容易在团队里引发“还是换回去吧”的情绪反弹。4. 实操从 Figma 迁移到开源工具的完整路径4.1 第一步盘点文件别一股脑全搬迁移的第一步不是导出而是做减法。打开你的 Figma 团队项目按“最后编辑时间”排个序你会惊讶地发现过去三年里有大量文件夹已经大半年没打开过。这些文件压根不需要迁移直接归档处理就好。真正值得迁移的通常只有三块当前正在迭代项目里的设计稿、一个或两个核心设计系统库Library、以及准备交付研发的完整原型。对每个待迁移文件先在原 Figma 里做一次“手术式整理”删除多余的隐藏页面和废弃图层给图层重新命名能并进组件里的元素就不要散落得到处都是。这个整理动作看起来费时但它直接决定了迁移后文件的可维护性。我之前见过一个真实案例有人把一百多页的设计稿原样导入开源工具结果光整理流浪图层和命名就花了一周非常折磨。4.2 第二步导出与转换的可行方式很遗憾Figma 到开源工具目前没有“一键无损迁移”的银弹但用对方法至少能保住大部分设计资产。方式一原生格式导出。你可以在 Figma 里使用插件或官方 API 将整页导出为 SVG 或 PDF。SVG 保留了矢量和大部分命名适合单页面的精细迁移PDF 适合做高保真存档但后续继续编辑的能力几乎为零。方式二通过 API 批量导出。如果你会写一点脚本可以申请一个 Figma 个人访问令牌也就是热搜里大家问的“Figma MCP token”调用 REST API 批量拉取文件节点导出为 JSON 结构或 SVG。这招最大的价值在于能把文件里的图层层级、坐标、尺寸这些结构信息一并取出之后可以写脚本做一层“翻译”在 Penpot 里还原一部分框架。但要注意Figma 的 Auto Layout 逻辑和 Penpot 的 CSS Grid 并不是一一对应的自动转换出来的结果不会太干净一定得有人工二次整理的过程。方式三手动重建关键基建。最稳妥、但对人力要求最高的方式不追求自动迁移只把核心设计系统颜色、字体、间距、组件在新工具里手动重搭一遍。这种方式虽然慢但换来的是后续几个月的“干净底座”。我个人在实际迁移时习惯把方式三和方式二结合核心库手动重建、普通页面走批量导出整体效率最高。4.3 第三步在 Penpot 里重建设计系统设计系统是任何一次工具迁移的“地基”这块没打好后面的项目都会摇摇晃晃。在 Penpot 里重建设计系统我建议按这个顺序来先建颜色样式再建字体样式然后做基础组件最后才是业务组件。颜色和字体一定要定义成 Style不要画一个矩形就填一个色值、写一行字就设一次字号。没有 Style 管理的话后面改一个主色你得满画布去找哪些元素用到了它效率极低。基础组件从按钮、输入框、弹窗这类最小单元开始全部用 Component 来做变体Variant用来管理状态变化比如默认、悬停、禁用、加载这些。Penpot 的组件变体功能从 2.1 版本开始已经相当稳定以前用过 Figma Variants 的人上手不会有障碍。业务组件不要急着一次建完。先挑当前迭代需要用到的三五个组件做出来一边做项目一边补全这比你闭门造车两周建完一百个组件要靠谱得多。设计系统这东西一定是在真实项目里“长”出来的不是一次性“写”出来的。4.4 第四步调整团队协作与开发交付流程迁移之后最容易被忽略的就是流程调整。原来在 Figma 里“设计完了直接给开发开 Dev Mode”的流程在 Penpot 里得换成“设计稿 标注说明 切图资源打包”的组合。我跟团队现在用的方式是在 Penpot 里放设计稿旁边挂一个 Markdown 交互说明文档把切图资源、间距变量、组件使用规则都写在文档里开发打开文档配合截图就能开工。对于 AI 编程团队自托管开源工具反而给了更大的发挥空间。你可以直接在自己的 Penpot 实例上架一层内部 API把设计稿的图层结构和样式数据喂给 AI 模型。基于 Figma 的官方 MCP 往往受平台限制、token 过期、速率配额等问题困扰而自托管的数据接口完全由团队自己掌控。对于已经在 Trae、Codex 这些工具里折腾过 Figma MCP 的人来说这种“自己掌握数据出口”的方案可能才是 AI 工作流真正需要的形态。5. 高频问题排查与避坑记录5.1 迁移过程中最常踩的四个坑第一个坑是字体。Figma 文件和 Penpot 的字体库不一致迁移过来的文件里大量文字会被替换成默认字体版式直接变形。解决办法是在迁移前把关键文本转成矢量轮廓再导出。虽然这让文字不再可编辑但至少保住版式。如果必须保留文字可编辑属性就必须提前把用到的字体文件都部署到自托管服务器上并在全局字体设置里逐一映射。第二个坑是组件关系丢失。Figma 导出的 SVG 里只有固定形状组件实例和主组件Master Component之间的关系完全丢失。迁移完成后先在 Penpot 里把按钮、卡片、导航栏这类高频组件清理重建别试图用脚本去自动恢复组件关系那不现实。第三个坑是动效和原型。Figma 的 Smart Animate 和交互连线在导出后基本不可复用。动效依赖很重的项目要么暂时留在 Figma 里要么迁移后从头重做交互。这个工作量要提前评估不然排期会爆炸。第四个坑是无运维能力却硬上自托管。Penpot 的 Docker 部署本身不难但后续的备份、升级、反向代理配置、多人并发性能优化都需要持续有人管。没有运维资源的团队建议先用 Penpot 的云端免费版把流程跑通别一上来就自托管。5.2 留在 Figma 的日子里这些高频问题也要知道既然很多团队还在双轨并行我顺便把大家问得最多、也最影响体验的几个 Figma 使用问题一并梳理一下。第一个是“Figma 有没有中文版”。Figma 官方一直没有中文界面社区里有汉化插件可以用但注意汉化包并不是官方出品客户端升级后经常失效。建议把它当成辅助工具不要过度依赖界面那些英文术语用几次就熟了。第二个是字体装不上。Figma 的网页版只能识别系统已安装的字体Windows 上安装新字体后需要重启浏览器或 Figma 应用才能识别。网页版有时还会出现中文字体识别不完整的情况这时候优先使用系统通用字体例如 PingFang SC、Microsoft YaHei重点交付项目最好把字体文件同步到共享字体库里。第三个是“Figma MCP 的 token 在哪获取”。在 Figma 桌面端点击头像进入设置找到“安全”或“账户”选项里的“个人访问令牌”入口生成一个令牌后将它配置到你的 MCP 客户端里。注意这个令牌只会完整显示一次务必当场复制保存好。第四个是“Figma MCP 在 Codex 或 Trae 里用不了”。这类问题八成出在权限配置上。先确认自己当前 Figma 账号有目标文件的访问权限再检查 MCP 配置里的 token 是否有效最后看网络能否正常访问 Figma 的 API。有一点可以明确Figma MCP 本身不额外收费只要你设计师账号里能正常调用 API 就可以了。5.3 双轨并行是我目前最推荐的状态我现在的做法是Figma 和 Penpot 一起用。Figma 负责所有需要外部协作、复杂交互动效、工程化交付的项目Penpot 负责内部实验、个人项目、数据敏感的设计以及 AI 工作流的底层图纸服务。两个工具之间用“导出 SVG 手动重建核心库”的方式保持互通不指望一键迁移。这样做的最大好处是你不会被任何单一平台绑架。哪怕某天 Figma 再次调整价格或者 Penpot 推出了一个杀手级功能你都能以最小成本切换过去因为你随时清楚自己的设计资产“怎么搬走、搬到哪、要花多久”。6. 最后再聊几句心里话这些年折腾设计工具我最大的体会是工具永远应该是服务工作流的而不是让工作流反过来迁就工具。Figma 确实强但它的强带着明显的平台属性和不断上涨的成本开源工具越来越能打但它要求你付出运维、学习和迁移的隐性成本。如果你现在问我“应该放弃 Figma 吗”我的回答是不要为了标榜开源而放弃也不要因为盲目追随主流就留下。先把手头的工作流完整盘点一遍算清楚成本和迁移时间再用双轨并行方式试运行一两周答案自然会浮出水面。真正的专业能力从来不取决于你贴在哪个工具 Logo 下的身份认同而是你随时能搞清楚自己有多少资产、多少时间、多少选择权。至少在我个人的使用经验里把这件事想明白比单纯纠结“用 A 还是用 B”要重要太多。