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

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

前言

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

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

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

以下出场顺序不排先后。

yft-design

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

Github 开源地址: github.com/dromara/yft... (300+ star)

在线体验地址: yft.design

vue-fabric-editor

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

Github 开源地址: github.com/nihaojob/vu... (3000+ star)

在线体验地址: nihaojob.github.io/vue-fabric-...

gzm-design

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

Github 开源地址: github.com/LvHuaiSheng... (60+ star)

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

fabritor

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

Github 开源地址: github.com/sleepy-zone... (200+ star)

poster-design

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

Github 开源地址: github.com/palxiao/pos... (2000+ star)

在线地址: design.palxp.cn/

最后

以上就是文章的全部内容了,感谢看到这里!如果觉得写得还不错,对你有所帮助或启发,别忘了点赞收藏关注"一键三连"哦~ 我是茶无味(公众号: 品味前端),一名平凡的前端 Developer,希望与你共同成长~

相关推荐
CXH728几秒前
架构师的登山之路|第十二站:服务网格 Istio——未来的标配,还是复杂过头?
前端·javascript·istio
脾气有点小暴23 分钟前
详解 HTML Image 的 mode 属性:图像显示模式的灵活控制
前端·html·uniapp
0思必得01 小时前
[Web自动化] 开发者工具性能(Performance)面板
运维·前端·自动化·web自动化·开发者工具
二进制情书1 小时前
510-GitHub基础
github
心灵的制造商1 小时前
el-tree左侧新增类别和删除类别实例代码
前端·javascript·vue.js
冴羽1 小时前
不知道怎么写 Nano Banana Pro 提示词?分享你一个结构化示例,复刻任意图片
前端·人工智能·aigc
IT_陈寒1 小时前
JavaScript 性能优化:7个 V8 引擎隐藏技巧让你的代码提速200%
前端·人工智能·后端
脾气有点小暴1 小时前
uniapp通用单张图片上传组件
前端·javascript·vue.js·uni-app·uniapp
薛定e的猫咪1 小时前
中国版 ReadmeX + 海外爆款 Zread.ai:两款 AI 工具重构开源项目探索方式,一键解析GitHub项目,生成超详细技术文档。
人工智能·重构·开源
小菜今天没吃饱1 小时前
DVWA-XSS(stored)
前端·网络安全·xss·dvwa