想画出高颜值的流程图，试试这个手绘风开源白板

工作中总是少不了要画画图，不管是开发中绘制流程图，还是设计系统时画出架构图，一款趁手的工具总是少不了。今天我们就来聊聊画图的白板工具。

今天我们推荐的推荐的项目帮你画出手绘风的高颜值图标，目前在 GitHub 已超过 66K Star，它就是：excalidraw

excalidraw 是什么?

Excalidraw 是一个虚拟白板应用，专门用于绘制类似手绘的图表。它提供了一个无限的、基于画布的白板，具有手绘风格，支持多种功能。

Excalidraw 具备轻量级、易用、美观、安全、协作等能力，非常适合用于技术文章配图、思维导图、架构图、流程图等场景。Excalidraw 编辑器提供的能力包括：

• 免费且开源。
• 无限的、基于画布的白板。
• ✍️类似手绘的风格。
• 黑暗模式。
• ️可定制。
• 图片支持。
• 形状库支持。
• 本地化（i18n）支持。
• ️ 导出为 PNG、SVG 和剪贴板。
• 开放格式 – 将图纸导出为.excalidraw
• json 文件。
• ⚒️ 多种工具 – 矩形、圆形、菱形、箭头、线条、自由绘制、橡皮擦 …
• ➡️ 箭头绑定和标记箭头。
• 撤消 / 重做。
• 缩放和平移支持。

下面是它的 GitHub star 历史，Excalidraw 在绘图工具圈里起步算是比较晚的，但是可以看出发展还是非常快的。

为什么用 excalidraw

绘图工具还是很多，比如 processon、PlantUML、Draw.io，之前我也一直在用 Draw.io 画图，来说说 excalidraw 对比同类的特点：

• 手绘风：excalidraw 主打的第一点就是手绘风格，从呈现来说，我个人觉得更好看一些。
• 易于集成：excalidraw 可以很容易的集成进你的 app，也提供多种集成插件方便开发过程。
• 快速上手：使用上和主流产品基本一致，可以无成本快速上手使用。
• 协作：支持团队协作
• 安全：支持端到端的加密，保障数据安全。

使用 excalidraw

在线环境

首先 Excalidraw 还提供了在线的环境方便用户快速上手，地址如下：https://excalidraw.com/

进入后直接就可以开始画图，连登录什么的都不需要，不扫码、不要验证码，真是要好评一个。

顶部的工具栏是可以直接按数字键来切换的，细节拉满。

也有一些小小的不适应，就是 Draw.io 的框里可以直接加文字，在这里是创建一个文本，我一开始还奇怪字怎么歪了。

点击右侧可以打开素材库，自己画的内容就是自己的素材，还可以去素材库添加素材

加了一些图标进来，还是用现成的素材省事。除了基本的素材，也有模版，可以自己翻一番。

可以将自己的画作保存下来，或者也可以分享给其他同伴来协同工作。怎么样我画图还不错吧，这个也是个模版。

自己部署

项目支持 docker 运行也支持源码运行：

源码的话，前提要确认已经安装好 nodejs，接下来：

 下载代码
git clone <https://github.com/excalidraw/excalidraw.git>

安装
yarn

启动
yarn start

现在可以打开 http://localhost:3000 并开始使用

docker 的话：

可以在源码中构建 docker image

docker build -t excalidraw/excalidraw .

也可以直接从 dockerhub 拉

docker pull excalidraw/excalidraw

总之获取镜像之后，启动就可以了。

docker run --rm -dit --name excalidraw -p 5000:80 excalidraw/excalidraw:latest

最后 excalidraw 还提供了一个 VScode 插件，可以直接在 vscode 里画图了。

项目信息

• 项目名称：excalidraw
• GitHub 链接：https://github.com/excalidraw/excalidraw
• Star 数：66K+