How I built a zero-server, 100% private web toolkit (UtilityKits)

Hi everyone!

I kept running into the same annoying problem: every time I needed to compress an image for an online form or fix my Instagram caption spacing, I ended up on sketchy websites filled with pop-up ads. Even worse, most of them upload my private photos to their servers to process them.

So, I built UtilityKit, a minimalist 4-in-1 toolkit that runs 100% on the client-side.

What’s inside?

1. Image Compressor & Cropper: Uses the HTML5 Canvas API to crop to social ratios (1:1, 16:9) and compress images to exact KB sizes.

2. Caption Formatter: Uses invisible Unicode spaces (\u2060) to force social media platforms to keep line breaks. It also extracts hashtags to a “First Comment” box.

3. QR Code Generator: High-res, no watermarks.

4. Password Generator: Uses Math.random() and crypto for secure, instant passwords.

The Tech Stack
It is built with pure HTML, CSS, and Vanilla JavaScript. No frameworks, no backend servers. Because everything happens in the browser, my hosting cost is $0 (Netlify), and user privacy is 100% guaranteed. I literally have no database for them to hack!

I’d love to know what you think or what tool I should build next. You can check out the live site here: https://utilitykits.netlify.app/

Thanks for reading!