手绘白板 基于开源项目 Excalidraw,把那种「拿白板笔随手画」的体验搬到浏览器里。所有图元(矩形、圆、菱形、箭头、文字、便签、自由笔画、图片)都是带手绘风格的矢量元素,可任意拖拽、对齐、群组、复制粘贴。
顶部工具栏从左到右依次是:锁定 / 手形(拖画布)/ 选择 / 矩形 / 菱形 / 椭圆 / 箭头 / 直线 / 自由笔 / 文字 / 图片 / 橡皮。每个工具的快捷键就是它的英文首字母(R 矩形、A 箭头、T 文字、P 笔),鼠标悬停可见提示。选中图元后右侧会弹出属性面板(颜色 / 笔触粗细 / 填充样式 / 字体 / 圆角 / 层级 / 透明度)。
| 操作 | 快捷键 |
|---|---|
| 撤销 / 重做 | ⌘/Ctrl + Z / ⌘/Ctrl + Shift + Z |
| 复制 / 粘贴 / 剪切 | ⌘/Ctrl + C / V / X |
| 群组 / 解组 | ⌘/Ctrl + G / ⌘/Ctrl + Shift + G |
| 对齐到网格 | 按住 Shift 拖动 |
| 等比缩放 | 按住 Shift 拉手柄 |
| 缩放画布 | ⌘/Ctrl + 滚轮 或 +/- |
| 重置缩放到 100% | ⌘/Ctrl + 0 |
| 适配全部内容 | Shift + 1 |
| 锁定图元 | 选中后右上角”🔒“ |
每次绘制会自动同步到 localStorage(toolbox_whiteboard_data),刷新或关浏览器后再回来还在。要分享给同事,请用左上角菜单 → “Save to…” 导出 .excalidraw 文件,对方在 Excalidraw 或本工具用 “Open” 打开即可。本工具不连接任何服务器,包括字体也是从同源 /libs/excalidraw/ 加载,可断网使用。
Mermaid 是"代码生成图"——你写 DSL,引擎按规则布局,适合流程图、时序图等结构化图表。白板是"自由手绘"——你拖什么就是什么,没有布局约束,适合头脑风暴、架构示意、教学板书。两个工具互补:先在白板上发散思考,定稿后用 Mermaid 出正式图。
完全不上传。所有绘制、渲染、导出都在你浏览器本地完成,可断网使用。每次改动会自动存进 localStorage(防抖 600ms),刷新页面、关浏览器后再回来还在。要永久保存请用左上角菜单的"Save to..."导出 .excalidraw 文件,发邮件或存网盘后再"Open"打开即可。
左上角菜单 → Save to / Export:① PNG —— 适合贴 PPT / 微信 / 公众号,可选透明背景、深色/浅色背景、是否含网格;② SVG —— 矢量无损,适合贴 README 或印刷;③ .excalidraw —— 含完整图元数据的源文件,下次可再次打开编辑;④ 直接 复制到剪贴板 粘到 Notion / 飞书富文本。
支持中文。Excalidraw 内置中文手绘字体 Xiaolai(小赖字体),无需额外安装。文字工具里有 4 种字体可切换:手绘体、普通体、代码体、Excalifont(默认)。所有字体打包在工具内,本地加载不外联 CDN。
可以。直接把图片文件拖到画板,或从剪贴板粘贴。图片会以 base64 形式存进 .excalidraw 文件和 localStorage,所以贴大图会占空间——单张建议 < 1MB,画板里图片太多时浏览器存档可能写不进 localStorage(一般上限 5–10MB),这种情况请及时导出 .excalidraw 文件。
支持。Excalidraw 监听 Pointer Events,Apple Pencil、Wacom 数位笔、Surface Pen 等都能直接用,压感目前不支持(笔画粗细需要在工具栏手动调)。手机/平板浏览器也能跑,但工具栏较密,建议横屏使用。
本工具是单人离线版,不支持多人实时协作。要协作请用 Excalidraw 官网(excalidraw.com)的房间功能,或者导出 .excalidraw 文件互相发送编辑。本工具的定位是"快速画一张图就走",不引入账号与服务器。