5 款值得推荐的开源图片编辑器「建议收藏」

本文首发于公众号：品味前端，作者：茶无味，转载请注明出处。

前言

在数字时代，图片编辑器变得尤为重要，因为良好的海报图片可以比普通文字更吸引用户眼球，有助于增强吸引力或达到更好的宣传效应。

越来越多的在线设计网站相继出现，也发展了数十年，为设计师和普通团队提供了一种新的创作方式。使用在线设计网站时，⽤户通过简单的拖、拉、拽等操作，就可以轻松制作出精美的⼿机海报、文章长图、电商产品图、新媒体素材、视频/公众号封面、营销及⾏政物料等各类平⾯设计与创意效果。可以更方便地解锁创意，促进团队合作，优化未来的设计道路。

在这篇文章中，我搜罗了 Github 上的相关的项目，向各位推荐 5 个我觉得非常不错的开源图片编辑器，每款都有各自特点并且都是近期仍在更新迭代的，希望对你有所帮助。

以下出场顺序不排先后。

yft-design

一个基于 fabric.js 的在线图片编辑器，使用 Vue3 + TypeScript + Fabric.js + Element-Plus 的技术栈，该项目看起来比较注重设计文件的解析方面，作者是采用了 Python 库 psd-tools 在后端进行解析，支持 PSD、PDF 等多种格式解析，同时也支持导出图片、SVG、PDF 等多种格式的文件，不过该后端解析源代码目前尚未开源，感兴趣可以向该作者了解~

Github 开源地址：
https://github.com/dromara/yft-design （300+ star）

在线体验地址：
https://yft.design

vue-fabric-editor

同样是一款基于 fabric.js 和 Vue 的图片编辑器，是 Github 上的热门编辑器之一，目前作者已经维护两年了，很用心的项目！其侧重点是插件化，致力于让别的项目能快速接入图片编辑器的功能。另外该项目在国际化方面也做得不错，听说有些外国友人也在使用呢~

Github 开源地址：
https://github.com/nihaojob/vue-fabric-editor （3000+ star）

在线体验地址：
https://nihaojob.github.io/vue-fabric-editor/#/

gzm-design

这款编辑器是基于 Leafer 和 Vue 技术栈的，PSD 解析则采用了 ag-psd 这个库，解析效果还不错。leaferjs 类似于前面提到的 fabric.js，同样是一套操作 Canvas 的 JS 库，总体都是比较新的，相比于老牌的 fabric.js 优势尚不明朗，不过还是值得体验的~

Github 开源地址：
https://github.com/LvHuaiSheng/gzm-design （60+ star）

在线预览地址：
http://gzm-design.guozimi.cn/#/editor

fabritor

这是今天介绍的第三款基于 fabric.js 的图片编辑器了，作者表示虽然类似的编辑器已经很卷了，但基本都是 Vue 开发的，于是他采用了 React + Antd 的组合，这也是今天唯一介绍到的 React 技术栈项目，该编辑器目前开发时间尚短，所以功能看起来比较少，也暂时没有在线预览地址，期待后续的更新~

Github 开源地址：
https://github.com/sleepy-zone/fabritor-web （200+ star）

poster-design

以上提到的编辑器均是基于 Canvas 渲染和出图的，而接下来介绍的这个项目则是完全利用 HTML 能力实现的前端画布编辑，出图基于后端无头浏览器，由本人耗时两年开发，半年前正式开源，在之前的文章里都有介绍过，这里就不多说啦。核心编辑器与 Node.js 后端渲染服务均开源，在线官网「迅排设计」所有功能完全免费使用，近期也上线了免费的在线 AIGC 功能，欢迎体验。设计器持续更新迭代中，未来将致力于做最酷的开源在线海报图片设计器~