Why did my exported PNG come out dark?

The ink layer is transparent, so the export paints the board colour behind it first, and that colour is the page surface, which follows whichever theme you are viewing in. Export from the dark theme and you get white-ish strokes on a dark page. Switch to the light theme before pressing Download PNG if you want ink on paper.

Pen and touch both come through pointer events, but stroke width is fixed, pressure is ignored.

Online Whiteboard with Undo and a 1600 × 1000 PNG Export

How it works

Online Whiteboard with Undo and a 1600 × 1000 PNG Export

A blank board you can draw on with a mouse, a stylus or your finger. Change brush size and colour, erase, undo as far back as you like, and export a PNG, all in the page.

What this does

A fixed 1600 × 1000 board that scales down to the width of your screen
Six inks, one of which follows the page theme rather than a fixed colour
Brush size on a slider from 1 px to 48 px
The eraser cuts pixels out of the ink layer instead of painting white over them
Undo and redo move one whole stroke at a time, pointer-down to pointer-up
Touch scrolling is switched off over the board, so a finger draws instead of panning the page
Download PNG flattens the ink onto the board colour and saves whiteboard.png

FAQ

No. Strokes live in the page and a reload empties it, there is no autosave, so export before you close the tab.

A stroke is everything between pressing the pointer down and lifting it, and that whole thing is one entry on the stack, undo never steps back by a pixel or a frame, and redo replays entries in order until you draw something new, at which point the redo stack is dropped. The eraser is a destination-out composite, which cuts the ink away rather than covering it, so it always has a crisp round edge. That is the price of an export whose background stays clean instead of accumulating white patches.

Keep going