一、开源项目简介

快图设计 - vue-fabric-editor

基于 fabric.js 和 Vue 开发的插件化图片编辑器，可自定义字体、素材、设计模板、右键菜单、快捷键。

中文名字叫做快图设计，英文名字是vue-fabric-editor，基于 fabric.js 和 Vue开发，特点是简单易容、功能齐全、插件化架构，非常适合二次开发。

二、开源协议

使用MIT开源协议

三、界面展示

项目预览界面

自定义字体

渐变、自定义字体、大小、行高、间距、背景色都可以调整，还有描边、阴影等通用属性。

图形绘制

不仅仅支持文本，普通的形状元素、SVG、二维码、条形码、不规则多边形都支持

右键菜单快捷键

可以通过插件化的方式来定义快捷键和右键菜单，

图片滤镜

图片裁剪

拖拽调整画布

PSD导入

水印设置

分类素材

创建设计与作品分类

功能比较完整，包括设计模板、登录注册、新建设计、用户作品素材管理等功能：

四、功能概述

帮助开发者快速构建图片编辑器应用

一款开源图片编辑器，更像一个开源在线设计工具，可用于海报设计、图文笔记、商品设计、封面设计、标签设计、logo设计、等场景，自定义字体、素材、设计模板、右键菜单、快捷键，还提供插件化的方式扩展二次开发。

它是一款基于Fabric + Vue3开发的一款开源Web图片编辑器，二次开发简单、扩展便捷，可帮助开发者快速构建一个面向非专业设计人员的图形编辑器。

特点

1. 插件化架构：可自定义素材、右键菜单、快捷键等功能，易扩展。

2. 简洁易用：以轻量、简洁为主的图形编辑器，而非大而全的在线 PS 类的重行设计工具。

3. 功能齐全：自定义模板、渐变、自定义字体等功能，满足轻量图片编辑场景。

已有功能

功能介绍文章 文字 + 动图。

• 导入 JSON、PSD 文件

• 保存为 PNG、SVG、JSON 文件

• 插入 SVG、图片文件

• 多元素水平、垂直对齐方式

• 字体模板

• 组合/拆分组合

• 图层及顺序调整

• 撤销/重做

• 背景属性设置

• 外观属性/字体属性/描边/阴影

• 自定义字体

• 自定义模板素材

• 快捷键

• 右键菜单

• 辅助线

• 标尺

• 图片替换

• 图片滤镜

• 国际化

五、技术选型

使用

启动项目

请先安装 node.js v16，及 pnpm， 然后执行以下命令：

pnpm i
pnpm dev