Every "free online tool" site I've ever used follows the same playbook: upload your file to their server, wait, download the result — usually after a signup wall, a file-size cap, or a watermark slapped on your output. Your data sits on someone else's machine, and you just have to trust that they delete it.
I didn't love that. So I built ToolKnit — 58 free online tools that run entirely in your browser. No backend server. No file uploads. No accounts. No database. Just static HTML, CSS, JavaScript, and a pile of WebAssembly.
Here's how it all works under the hood.
The Architecture: There Is No Server
ToolKnit is a static site. Every page is plain HTML served from a single origin. There is no Express server, no Lambda function, no S3 bucket receiving your files. When you compress a PDF on ToolKnit, the compression happens on your device. When you convert a PNG to WebP, your browser's Canvas API does the pixel work. Nothing leaves your machine.
This isn't a philosophical choice — it's a technical one. Browser APIs in 2026 are powerful enough to handle 90% of what people use online tools for. The remaining 10% (think: server-side AI, heavy video transcoding at scale) doesn't justify compromising on privacy for the other 90%.
The Tech Stack
| Layer | Technology |
|---|---|
| pdf-lib (WebAssembly) — compress, merge, split, convert | |
| Video | FFmpeg.wasm — compress, convert to GIF, extract audio |
| Image | Canvas API + OffscreenCanvas — format conversion, crop, resize, compress, pixel art |
| Audio | Web Audio API + AudioContext — MP3 ↔ WAV conversion, video audio extraction |
| OCR | Tesseract.js — extract text from images |
| Crypto | Web Crypto API — password generation with true randomness |
| Export | Canvas 2D API — pixel-perfect PNG/PDF export for the Daily Planner |
| Styling | Tailwind CSS + Space Grotesk — consistent B&W theme across all 58 tools |
| Offline | Service Worker — full PWA, works without internet after first visit |
No React. No Vue. No build step. Every tool is a self-contained HTML page with inline <script> tags. Sounds old-school? It is. It also means zero bundle size overhead, instant page loads, and the ability to cache every tool independently via the Service Worker.
58 Tools, 8 Categories
Here's what you can do without uploading a single byte to any server:
📄 PDF Tools (6)
Compress PDF, Merge PDF, PDF to Image, Image to PDF, PDF to Word, Word to PDF.
All powered by pdf-lib running in WebAssembly. The compression works by downsampling embedded images and stripping unused metadata — no quality loss on text, significant size reduction on image-heavy documents.
🖼️ Image Tools (12)
Compress, crop, resize, grid split, pixel art converter, flip & rotate, plus six format converters (JPG ↔ PNG ↔ WebP).
The pixel art converter is one of my favorites. It quantizes colors using median-cut, applies optional dithering (Floyd-Steinberg, ordered, Atkinson), and ships with presets for Game Boy, NES, and SNES palettes. All in ~400 lines of vanilla JS.
🎬 Video Tools (3)
Compress Video, Video to GIF, Video to Audio.
FFmpeg.wasm is a beast. It's a full FFmpeg compiled to WebAssembly — we're talking H.264 encoding/decoding, GIF muxing, and audio extraction, all in a browser tab. The trade-off is a ~25MB WASM download on first use, but it's cached by the Service Worker after that.
🎵 Audio Tools (2)
MP3 to WAV, WAV to MP3.
Web Audio API handles decoding. For MP3 encoding, we use a WASM-based LAME encoder. Bitrate is user-selectable from 128–320 kbps.
📝 Text Tools (6)
Character Counter, Lorem Ipsum Generator, Extract Text (OCR), QR Code Generator, Password Generator, Text Diff.
The Password Generator uses crypto.getRandomValues() — not Math.random(). Customizable length (4–128 chars), character type toggles, real-time strength analysis, and bulk generation up to 50 passwords at once.
Text Diff does line-by-line comparison with additions, deletions, and unchanged lines highlighted — unified or side-by-side view. Built from scratch, no difflib dependency.
🧮 Calculator Tools (4)
Age Calculator, Unit Converter, Percentage Calculator, BMI Calculator.
⏱️ Time & Productivity (6)
Stopwatch, Countdown Timer, World Clock, Pomodoro Timer, Invoice Generator, Timestamp Converter, Daily Planner.
The Daily Planner deserves its own section (see below).
🎮 Creative & Fun (13)
Whiteboard, Random Spinner Wheel, What to Eat?, Ask Fate (Magic 8-Ball), Keyboard Tester, Reaction Time Test, Aim Trainer, CPS Test, Coin Flip, Dice Roller, Color Picker, Gradient Generator, Daily Planner.
The Canvas 2D Rewrite: Why I Ditched html2canvas
The Daily Planner lets you design a weekly schedule and export it as a pixel-perfect PNG or PDF. Version 1 used html2canvas for the export. It worked — mostly. But html2canvas doesn't actually use your browser's rendering engine. It re-implements CSS in JavaScript, reads your DOM, and paints an approximation onto a canvas.
The result? Fonts were slightly off. Border-radius clips were wrong. Gradients didn't match. Every CSS property I added required checking whether html2canvas supported it.
So I ripped it out and wrote raw Canvas 2D API calls:
// Instead of html2canvas re-interpreting my CSS...
ctx.fillStyle = '#0a0a0a';
ctx.fillRect(0, 0, width, height);
ctx.font = '700 28px "Space Grotesk"';
ctx.fillStyle = '#ffffff';
ctx.fillText(title, x, y);
// Rounded rectangles for time slots
ctx.beginPath();
ctx.roundRect(slotX, slotY, slotW, slotH, 12);
ctx.fillStyle = 'rgba(255,255,255,0.04)';
ctx.fill();
ctx.strokeStyle = 'rgba(255,255,255,0.08)';
ctx.stroke();
Pixel-perfect. Zero offset. The export now matches the browser preview exactly. Sometimes the simplest solution is the one you should have picked first.
Privacy by Architecture
This isn't a privacy policy — it's a privacy architecture. There's no server to leak data because there's no server processing data. Your files are read by the browser's File API, processed in local memory, and the output is generated client-side. The only network requests ToolKnit makes are:
- Google Analytics — page views only, no file data
- Ahrefs Analytics — same, page views only
- Google Fonts — loading Space Grotesk
That's it. No telemetry on what files you process, how large they are, or what tools you use. No cookies for tracking individual users. The only local storage is a daily usage counter (500 uses/day fair-use limit) and optional personal bests for gaming tools.
Offline-First: It's a PWA
ToolKnit registers a Service Worker that caches all tool pages and core assets on first visit. After that, you can:
- Disconnect from the internet
- Open any cached tool
- Process files normally
On mobile, you can add ToolKnit to your home screen and it launches like a native app — full-screen, no browser chrome, instant load.
What I Learned Building This
Browser APIs are underrated. Canvas, Web Audio, File API, Crypto, Service Workers — you can build a lot before you need a server.
WebAssembly is production-ready. pdf-lib and FFmpeg.wasm handle real workloads. The WASM download is the only downside, and caching solves it.
Static sites scale infinitely. No server means no server costs, no server crashes, no server maintenance. The only cost is the domain and CDN.
Privacy sells itself. I never marketed ToolKnit as a "privacy tool." But when users realize their files never leave their device, they tell other people. Word of mouth from trust is the best marketing channel.
One tool at a time. I built and shipped one tool per session, tested it live, then moved on. 58 tools later, the compound effect is real.
Try It
toolknit.com — 58 free tools, zero uploads, works offline.
If ToolKnit has ever saved you five minutes, or helped you avoid installing yet another sketchy desktop app — share it with someone. Drop it in a Reddit thread. Mention it to a colleague. Every recommendation means the world to a solo developer shipping code at midnight.
Built by Zihang Dong. Follow the journey on GitHub.
Top comments (0)