ToolJutsu
All tools
Creative Tools

Whiteboard & Drawing

Sketch ideas on a free-form drawing canvas.

6px
Quick colours

Tip: hold and drag to draw. Use Ctrl+Z to undo,Ctrl+Shift+Z to redo.

Processed on your device. We never see your files.

How to use Whiteboard & Drawing

What this tool does

The whiteboard is a free-form drawing canvas that lives entirely in your browser. You get a brush for freehand sketching, straight lines, rectangles and ellipses for neat shapes, and an eraser for cleaning up. Pick a stroke colour and width, choose a background colour or make it transparent, and draw. Behind the scenes every mark you make is stored as a small shape object — a stroke is a list of points, while a line, rectangle or ellipse is just its geometry plus a colour and width. The picture you see is redrawn from that list every time something changes, which is what makes reliable undo, redo and saving possible. It loads with a small sample sketch so the canvas is never blank.

When you’d use it

Reach for the whiteboard whenever an idea is easier to draw than to describe. Sketch a website layout before building it, rough out a floor plan, map a quick flow of boxes and arrows, or annotate a screenshot. Teachers use a free-form canvas to draw diagrams for a worksheet or a slide. Hobbyists doodle, plan a craft project, or block out a comic panel. Because you can export a clean PNG in one click, it is also handy for making a quick illustration to drop into a presentation, a chat message or a blog post — no design software required. The transparent-background option means the drawing can sit on top of any colour once you place it.

How to use it

  1. The canvas opens with a sample sketch. Clear it whenever you want a blank start.
  2. Pick a tool from the toolbar — brush, line, rectangle, ellipse or eraser.
  3. Choose a stroke colour with the colour picker, or tap one of the quick colours for a fast change. Set the stroke width with the slider.
  4. Press and drag on the canvas to draw. With the brush you draw freehand; with line, rectangle and ellipse you drag from one corner to the other.
  5. Use the background colour picker to set a backdrop, or tick Transparent background so the drawing exports with no backing colour.
  6. Made a mistake? Press Undo (or Ctrl+Z); step forward again with Redo. Use Clear — then confirm — to wipe the canvas.
  7. Click Export PNG to download the picture, or Save JSON to keep an editable copy you can reload later with Load JSON.

Tips for great results

Build up a drawing in layers: lay down the big shapes first with the rectangle and ellipse tools, then add freehand detail with the brush on top. Keep a couple of stroke widths in mind — a thick width for outlines and bold marks, a thin one for detail and labels — and switch between them as you go. The eraser removes whatever is under it, including parts of earlier shapes, so it is great for trimming a stroke that overshot. If you are planning to place the drawing on a coloured background elsewhere, turn on transparency before you export. Save a JSON copy whenever a sketch reaches a state worth keeping; it is a tiny file and it lets you branch off without losing the original.

To take a sketch further, the image compressor will shrink an exported PNG before you email or upload it, and the colour palette generator helps you choose a harmonious set of stroke colours before you start. If you want to work pixel-by-pixel instead of with free-form strokes, the pixel art editor is the sibling tool for crisp, grid-based art.

Your work stays on your device

This whiteboard does everything in the browser. The shapes you draw, the sketches you load and the PNGs you export are all processed by JavaScript on your own machine — there is no upload, no server copy and no tracking of what you draw. Closing the tab discards the canvas. If you want to keep a drawing, export a PNG or save the JSON; otherwise it simply disappears, which is exactly what you want for a quick, private place to think with a pen.

Frequently asked questions

Is my drawing private when I use this whiteboard?
Completely. Every stroke you make is handled by JavaScript running inside your own browser tab. The canvas, the list of shapes behind it and any sketch you load from a JSON file all stay on your device — nothing is uploaded to a server, nothing is stored between visits and nothing is logged. When you close the tab the drawing is gone unless you exported it first. That makes the whiteboard safe for rough plans, confidential diagrams and ideas you are not ready to share.
What file formats can I export, and which should I pick?
Two formats. PNG is a finished picture: pick it when you want to drop the sketch into a slide, a document, a chat message or a blog post. If you turn on the transparent background, the PNG keeps that transparency so the drawing sits cleanly on any colour. JSON is a save file: it stores the shape list itself, so you can reload it later with the Load JSON button and keep editing. Use PNG to share the result and JSON to save your work in progress.
Can I undo a mistake?
Yes. Every completed stroke, line, rectangle or ellipse is recorded as a separate step, so the Undo button walks back through them one at a time, and Redo steps forward again. You can also press Ctrl+Z (Cmd+Z on a Mac) to undo and Ctrl+Shift+Z to redo. The history holds the most recent changes, so you can experiment freely and roll back anything you do not like.
Does the whiteboard work on a tablet or with a stylus?
Yes. The canvas uses pointer events, which means a mouse, a finger on a touchscreen and a pen or stylus all draw the same way. Touch scrolling is disabled over the canvas so dragging always draws instead of moving the page. On a small screen the toolbar wraps onto multiple rows and the canvas scales down to fit.
Why does my exported PNG look different from the canvas on screen?
It should not — the export is rendered from the same shape list at the canvas's full resolution, so what you see is what you get. If the background looks different, check the transparent-background switch: a transparent PNG will show whatever is behind it once you place it somewhere, while an opaque PNG carries the background colour you chose.

Related tools