DEV Community

Indie Maker
Indie Maker

Posted on

14 Tools, Zero Servers: How I Built a Whole Utility Belt That Runs 100% in Your Browser

This is part 2 of my browser-local tools series. In part 1 I argued that your files don't need to leave the device. This time, the full tour: 14 utilities I shipped that run 100% in the browser — each with the 30-second "how it actually works" for fellow devs. If you code, steal these patterns. If you don't, just bookmark the tools.

The whole collection lives at Quick Toolbox — free, no sign-up, and every tool works offline after the first load. Here's what's inside.

🖼️ Image tools: the Canvas API does all the heavy lifting

Image Compressor — Shrink JPG/PNG/WebP photos before sending them anywhere. Under the hood it's three lines of real work: createImageBitmap(file) to decode, drawImage() onto a canvas at the target size, then canvas.toBlob(callback, 'image/jpeg', quality) where the quality slider maps straight to that third argument. A 4MB phone photo becomes ~300KB at quality 0.8 with no visible difference.

Image Converter — Same pipeline, different MIME type. JPG ↔ PNG ↔ WebP, which covers 99% of real-world needs. The trick most people miss: converting PNG screenshots to WebP typically cuts 60–80% of the bytes.

Image Resizer — Set exact pixel dimensions or scale by percentage, with aspect-ratio lock so nothing gets stretched. Also lets you switch output format in the same pass — resize and convert in one click.

📄 PDF tools: yes, entirely in the browser

PDF Merger and PDF Splitter — The flow: FileReader → ArrayBuffer → a PDF library running in the page → copyPages() into a new document → save → trigger download. No server ever sees the bytes. This is the one I care about most: contracts, ID scans, bank statements — the exact documents you should never upload to a random "free PDF tool" site.

⌨️ Text & dev tools

JSON Formatter & Validator — JSON.parse() in a try/catch; on failure it maps the character offset from the error message back to a line and column so you see exactly where the trailing comma is. Beautify, minify, one click each.

Base64 Encode & Decode — The classic pitfall: btoa() throws on anything outside Latin-1. The fix is TextEncoder → bytes → btoa(String.fromCharCode(...bytes)), and the reverse with TextDecoder on decode. Full Unicode support, which half the online converters get wrong.

Timestamp Converter — Paste 1690000000 or 1690000000000, it figures out seconds vs. milliseconds with a magnitude heuristic and converts to readable date/time (Beijing Time included). Every backend dev has needed this at 2am.

Password Generator — Custom length and character sets, built on crypto.getRandomValues() — never Math.random() for anything security-adjacent. Generated locally, so the password literally never exists anywhere but your machine.

UUID Generator — crypto.randomUUID() in a loop, bulk-generate and copy them all with one click. Boring, essential.

QR Code Generator — A QR encoding library running in JS renders to <canvas>, and you download the PNG. Text, URLs, Wi-Fi credentials — handy for sharing a link from desktop to phone.

Word Counter — Handles mixed-language text (English words + CJK characters counted sensibly) and estimates reading time. Writers and translators use this daily.

Case Converter — UPPERCASE, lowercase, Title Case, camelCase, snake_case — regex transforms, one click. The kind of thing you need twelve times a day.

Color Converter — HEX ↔ RGB ↔ HSL with a live picker preview. Front-end devs: stop Googling "hex to rgb" forever.

Same philosophy, money edition: CalcWise

I applied the same "runs locally, nothing uploaded" idea to personal finance. CalcWise is a set of financial calculators — mortgage, compound interest, retirement planning, ROI — each paired with a plain-English guide that explains the math instead of just spitting out a number. Your salary numbers stay in your browser, where they belong.

And a directory of actually-free stuff: FreeHub

While building these I kept running into "free" tools with gotchas, so I started FreeHub — a directory of verified free tiers and deals: VPS hosts, cloud storage, domains, streaming, dev tools. Every entry is checked against the official site; anything that shut down or paywalled gets removed. If you're hunting for free infrastructure for your side project, start there.

What's next

Everything above is free, no account, no tracking of what you do with the tools. The pattern behind all of it is simple: if the browser can do it — and in 2026 it can do a lot — there's no reason to involve a server.

What utility do you wish existed as a zero-server browser tool? Drop it in the comments — the most-requested one gets built next. 👇

Top comments (1)

Collapse
 
svgicons profile image
Svg/icons •

For the QR generator, have you considered SVG output alongside PNG? The module grid maps naturally to vector shapes and avoids resampling blur at print or large sizes.