I needed a signature pad for RapidKit Tools , a set of free browser-based tools I'm building. Most online signature tools upload the image to a server. A signature is personal, so I wanted the drawing to stay on the user's device: no upload, no account.

I didn't write the drawing engine from scratch. The tool is built on react-signature-canvas , a React wrapper around signature_pad . Reading through the source taught me more than I expected, so here is what's actually going on under the hood.

Smooth lines are curves, not lineTo

Connecting raw pointer coordinates with straight segments looks jagged. signature_pad buffers recent points, computes control points from them, and draws cubic Bézier curves .…