你正开着线上会议,老板突然说:“来,我们画个架构图梳理一下。” 你瞬间慌了——打开笨重的专业软件太慢,用鼠标在画图工具里画出的直线和方框僵硬得像是建筑图纸,完全跟不上头脑风暴的节奏。这时候,你多希望有一个打开即用、画出来还带点人情味的手绘风格白板。
别急,开源项目 Excalidraw 就是来解决这个尴尬的。
它是什么?一个让程序员爱上画图的“虚拟白板”
简单说,Excalidraw 是一个开源、手绘风格的虚拟白板。它不像那些线条笔直、色彩冰冷的专业制图工具,它画出的每根线条、每个方框都带有轻微的不规则感,就像在白纸上用铅笔随手勾勒的草图。
但这正是它的魔力所在:图显得“未完成”,反而降低了讨论的心理门槛。别人看到精美原型往往只夸“画得真好”,而看到手绘草图,却更愿意说“这里我想改一下”——这对协作来说太重要了。
不止是“涂鸦”:小身材里藏了大味道
别被它轻松的“手绘风”骗了,Excalidraw 功能相当扎实,而且很多细节透着一股幽默的“省心感”:
- 无尽的画布与暗夜模式:画布永远拖不到底,再宏大的想法都装得下。深色模式下,你的图立刻赛博朋克,思路仿佛都清晰了三分。
- 工具不少,但绝不烦人:矩形、圆形、箭头、激光笔、自由绘画……该有的都有。一个容易被忽略的神功能是 “箭头绑定”——把箭头一端连到元素上,拖动元素时箭头会跟着走,再也不用像拼积木一样重新对齐。
- 导入导出,一切为了分享:支持导出 PNG、SVG,也能一键复制到剪贴板。更酷的是,它可以保存为 .excalidraw 纯 JSON 文件,这意味着你的图是开放、可读、可被其他程序解析的“数据”,而不仅仅是一张图片。
- 实时协作,而且真正关心你的隐私:分享一个链接,团队就能同时看到和编辑同一块白板,所有数据传输经过端到端加密。项目还强调 “本地优先”——数据自动保存在你的浏览器里,你不丢,它就一直在。
30秒上手,立刻体验“手绘自由”
想试试?完全不用安装任何东西。打开浏览器,输入excalidraw.com,你现在就可以成为手绘大师。
如果你想把它集成到自己的 React 项目里,也只需一条命令:
npm install react react-dom @excalidraw/excalidraw
然后就能在自己的应用里嵌入一块完整的 Excalidraw 白板。像 Google Cloud、Meta、Notion 和 Obsidian 这些大名鼎鼎的产品,都在内部用它。这意味着你学会用它,技能可以直接“迁移”到这些顶级工具里。
谁在“幕后”让它如此有趣?
Excalidraw由一群热爱开源和画图的人共同维护。它的魅力还体现在巨大的生态里:有程序员最爱的VS Code插件,让你不离开代码编辑器就能画流程图;Obsidian等笔记软件的集成也让它无处不在。
这个项目本身就像它画出的草图——开放、协作、不断进化。如果你也受够了笨重的画图软件,或者想在下次会议中“优雅”地惊艳全场,不妨去GitHub上找到它 ( https://github.com/excalidraw/excalidraw ) ,点个Star收藏起来,说不定下次解决技术方案时就派上了用场。甚至,去贡献一个翻译、报告一个bug,都能让这块白板变得更好。
毕竟,每个伟大的想法,可能都始于一张潦草的草图。