A layer for documents
Export a transparent PNG and place it into a slide deck, an image or a document that accepts images as a handwritten signature layer.
Loading…
Guide
The handwritten signature generator records mouse, finger or stylus strokes on a browser canvas and exports a transparent PNG, a white-background JPG or a vector SVG. It loads signature_pad on demand and adapts to the device pixel ratio and the window size; when the size changes it saves the stroke data, resets the canvas and replays the strokes. Page scroll gestures are disabled over the drawing area, so it can be written on directly on a mobile device.
Updated 2026-09-102 min read
| Input | Output | Notes |
|---|---|---|
| Handwritten strokes | signature.png |
Transparent background |
| The same strokes | signature.jpg |
A white background is laid down before export |
| The same strokes | signature.svg |
Vector paths from signature_pad |
minWidth is width ×0.4 and maxWidth is ×1.3.signature_pad stroke data at a time and removes the last stroke; it is not a pixel-level eraser.Export a transparent PNG and place it into a slide deck, an image or a document that accepts images as a handwritten signature layer.
Write on a tablet or a phone in landscape and export it, keeping the original strokes rather than applying a font.
PNG keeps a transparent background; the JPG export fills white first, which suits systems that do not support transparent layers.
The implementation saves the stroke data and replays it before resetting the high-DPI canvas, so a normal resize does not deliberately lose the strokes.
Strokes exist only in the current browser canvas and memory, and the export is produced locally by the browser; nothing is uploaded to a server.
Updated 2026-09-10
Draw an electronic signature with adjustable pen color and width; export transparent PNG, white JPG or SVG
Write with a mouse, a finger or a stylus; a stylus changes the line width with pressure
On mobile: the writing area disables page scrolling, so you can sign with a finger directly; landscape is more comfortable.