Online Signature Pad Demo

How to use this online signature pad

1. Draw your signature with a mouse, finger, or stylus. Pen pressure is used when your device reports it.
2. Pick a brush (pen, marker, calligraphy, or dotted), a stroke width, and a color.
3. Use Undo and Redo to fix individual strokes, or Clear to start over. Fullscreen gives you more room on a phone.
4. Choose PNG, JPEG, SVG, or Base64 in the export panel and download the file.

The demo runs entirely in your browser. "Send to API" here only simulates a request, so your signature is not uploaded anywhere.

Add this signature pad to your app

Everything on this page is built with the open-source AutographJS library. Install it with npm install autographjs and follow a step-by-step guide:

• React signature pad guide
• Vue 3 and Nuxt signature pad guide
• Full API documentation