eSign — Free Online Signature Maker

A privacy-first, build-less web app for creating handwritten and typed electronic signatures. Draw with your mouse, trackpad, touchscreen, or stylus, then download a transparent PNG to sign documents online. Everything runs in your browser — no server, no uploads, no tracking.

简体中文 | English

Live demo: https://nuoyax.github.io/e-sign/

---

Features

• Smooth handwritten signatures — Pointer Events unify mouse, touch, and stylus; quadratic-Bézier midpoint smoothing for fluid strokes; auto-scaled for high-DPI / Retina screens.
• Typed signatures — Enter your name and render it in elegant cursive fonts (Dancing Script, Great Vibes, Pacifico). Drag to position, toggle italic.
• Rich pen toolkit — 6 preset colors + custom color picker, adjustable stroke width (1–12px), three pen styles: ballpoint, translucent marker, pressure-style brush.
• Full undo / redo — History stack with keyboard shortcuts: Ctrl+Z, Ctrl+Shift+Z / Ctrl+Y.
• Flexible export — Download as transparent PNG, white-background PNG, or copy straight to clipboard.
• Light & dark themes — Follows your system preference by default, with a manual toggle saved to localStorage.
• Responsive & accessible — Works on phones, tablets, and desktops; ARIA labels on all controls; touch-action locked so the page won't scroll while you draw.
• Keyboard friendly — Ctrl+S downloads your signature (browser save intercepted).

Tech Stack

• Vanilla HTML5 / CSS3 / JavaScript (ES Modules) — zero dependencies, no build step.
• Canvas 2D API for drawing and rendering.
• Pointer Events for unified input handling.
• Google Fonts for cursive typography (graceful fallback to cursive offline).

No frameworks. No npm install. No bundler. Just open the file and it works.

Local Development

Because this is a build-less static site, simply open the entry file in a browser:

# Option 1: open directly
open src/index.html        # macOS
# or
start src/index.html       # Windows
# or
xdg-open src/index.html    # Linux

# Option 2: serve locally (recommended, so ES modules load over http:)
python -m http.server 8000 --directory src
# then visit http://localhost:8000

No installation, no build, no waiting.

Project Structure

e-sign/
├── src/                      # the entire app (build-less)
│   ├── index.html            # entry page
│   ├── manifest.webmanifest  # PWA manifest
│   ├── css/
│   │   └── style.css         # themes, responsive, a11y
│   ├── js/
│   │   └── app.js            # canvas, typed sig, undo/redo, export
│   └── assets/
│       └── favicon.svg
├── README.md                 # this file (English, default)
├── README.zh-CN.md           # 简体中文说明
└── LICENSE

Privacy

eSign is 100% client-side. Your signature never leaves your device — there is no server to upload to, no analytics, no cookies. You can use it offline once loaded.

Legal note: This tool helps you create a signature image. Whether an electronic signature is legally binding depends on your jurisdiction and the signing context (e.g., eIDAS in the EU, ESIGN Act in the US). For high-stakes contracts, use a qualified e-signature service.

License

MIT © halo