在线白板使用教程:无限画布随手画,一键导出 PNG/SVG/JSON

在线白板使用教程:无限画布随手画,一键导出 PNG/SVG/JSON

📁 设计👁️ 150 阅读⏱️ 5 分钟阅读🕒 2026/9/14

免费在线白板工具,基于 Excalidraw 手绘风格,支持画笔、形状、文字、图片与激光笔,自动保存不丢稿,一键导出 PNG、SVG、JSON,无需注册打开即用。

工具简介

在线白板是工具派基于 Excalidraw 打造的免费在线画板工具:打开网页就能在一张无限大的画布上随手涂画,默认已选中画笔工具,线条自带自然抖动的手绘质感。画矩形、圆形、箭头,写文字、贴图片都不在话下;所有内容会自动保存到浏览器本地,刷新页面也不会丢失。画完还能一键导出 PNG 图片、SVG 矢量图或 JSON 源文件,无需注册、打开即用,做草图、流程图、思维导图和会议板书都很顺手。

功能亮点

  • 无限画布 + 手绘风格:画布可随意平移缩放,没有边界限制;线条是 Excalidraw 标志性的手绘风格,比死板的矢量图更有草图感。
  • 完整绘图工具集:画笔、选择、矩形、菱形、椭圆、箭头、直线、文字、插入图片、橡皮擦一应俱全,还有适合演示讲解的激光笔。
  • 属性面板精细调节:选中元素后,左侧可改描边颜色、背景填充、描边宽度、透明度,还能用图层按钮调整上下叠放顺序。
  • 自动保存不丢稿:每次改动后约 0.5 秒自动写入浏览器本地存储,也可以点「保存到本地」立即保存,刷新或重开页面内容仍在。
  • 三种导出格式:PNG 位图(插入文档)、SVG 矢量图(放大不失真)、JSON 源文件(可再次导入继续编辑),分享与归档都方便。
  • 画布背景 + 深色模式:画布背景色可用取色器任意修改,浅色 / 深色主题一键切换,夜间画图更护眼。
  • 内置素材库:点击右上角「素材库」可浏览并插入内置图标与图形素材,省去自己画的功夫。

参数说明

顶部操作栏各按钮的作用如下:

按钮 作用
保存到本地 立即把当前画布内容写入浏览器本地存储
导入 JSON 载入之前导出的 .json 白板文件,恢复全部元素与画布状态
导出 JSON 下载 whiteboard.gjupai.json 源文件,适合备份与换设备继续编辑
导出 PNG 导出 whiteboard.png 位图,适合插入文档、PPT
导出 SVG 导出 whiteboard.svg 矢量图,可无限缩放不失真
画布背景 取色器,修改整张画布的背景色(默认浅灰 #f8f9fa
深色 / 浅色 切换界面与画布主题,深色主题背景为 #1a1a1a
激光笔 切换到激光笔工具,指针划过留下渐隐轨迹,适合演示讲解
清空画布 二次确认后删除全部元素,并同时清除本地存档

使用步骤

  1. 打开工具页面:顶部是操作栏(保存、导入、导出等按钮),中间悬浮的是绘图工具栏,左侧是属性面板,下方大面积浅灰空白就是画布,默认已选中画笔工具,无需登录即可使用。

在线白板主界面:顶部操作栏含保存到本地、导入/导出 JSON、导出 PNG/SVG、画布背景、深色、激光笔、清空画布按钮

  1. 直接开始作画:按住鼠标在画布上拖动即可手绘线条,画布上会提示「点击并拖动,完成时松开」,松手即成一笔,想画什么就画什么。

  2. 切换绘图工具:点击工具栏图标可画矩形、菱形、圆形、箭头和直线;点「A」图标插入文字,点图片图标插入本地图片;画错了用橡皮擦或左下角撤销按钮回退。

  3. 调节元素样式:点选已画的元素,在左侧属性面板修改描边颜色、背景填充、描边宽度(细 / 中 / 粗)和透明度,也可用图层按钮把元素上移一层或置于顶层。

  4. 个性化画布:点「画布背景」给整张画布换底色,点「深色」切换到深色主题;左下角的缩放控件可以放大缩小画布查看细节。

  5. 保存与导出成果:绘画过程会自动保存;完成后按需点击「导出 PNG」「导出 SVG」或「导出 JSON」,文件会直接下载到本地。

使用技巧

  • 演示讲解用激光笔:点「激光笔」后鼠标划过的地方会留下一条渐隐的红色轨迹,不会污染画布内容,讲完自动消失,特别适合线上会议圈重点。
  • 重要稿件导出 JSON 备份:自动保存依赖浏览器本地存储,清除浏览器数据会一并丢失;重要内容建议「导出 JSON」,换电脑后「导入 JSON」即可完整恢复继续编辑。
  • 背景色板一举两得:左侧属性面板里的「背景」色板不仅会改选中元素的填充色,也会同步修改整张画布的背景色,和顶部「画布背景」取色器效果一致。
  • 做流程图善用箭头与图层:箭头工具画连线,配合属性面板的图层按钮调整前后遮挡,几步就能排出结构清晰的流程图。
  • 清空前先确认:「清空画布」会把元素和本地存档一起删除且不可恢复,点击前最好先导出一份 JSON。

常见问题

Q1:画的内容刷新后会丢吗?
不会。每次改动约 0.5 秒后自动保存到浏览器本地存储,刷新或重开页面都会自动恢复。但清除浏览器缓存 / 数据会把它一起清掉,重要内容请额外导出 JSON 备份。

Q2:导出 PNG 和 SVG 怎么选?
要插入 Word、PPT、聊天消息选 PNG 位图,通用性最好;要继续放大编辑、印刷或做高清素材选 SVG 矢量图,任意缩放都不失真。

Q3:导入 JSON 有什么要求?
需导入本工具「导出 JSON」生成(或兼容 Excalidraw 格式)的 .json 文件,导入后会恢复其中的全部元素和画布状态;文件格式不对会提示解析失败。

Q4:用这个工具需要注册登录吗?
不需要。打开页面即可绘画、保存和导出,全程在浏览器本地运行,画图内容不会上传到服务器。