A growing collection of free file tools that run 100% in your browser. No uploads, no sign-up, no file-size limits. Your files stay locked on your device and are never sent to a server.
This is both a useful product and an SEO play: every tool is its own search-optimised landing page, and because all processing is client-side, the whole site is statically prerendered and costs ~$0 to run.
- Live tools
- Tech stack
- SEO / growth
- Develop
- Add a new tool
- Deploy (Vercel)
- Contributing
- Code of Conduct
- License
- Acknowledgements
| Tool | What it does |
|---|---|
Image Converter & Compressor (/tools/image-converter) |
Convert between WebP/JPG/PNG, resize, and compress — Canvas-based. |
Image Overlay (/tools/image-overlay) |
Drag/resize/rotate overlays onto a base photo; search free images (Wikimedia Commons), per-layer + base background removal, base brush touch-up, expanding canvas, trim-on-export — DOM edit + Canvas render. |
PNG Padding (/tools/png-padding) |
Add transparent or solid-colour padding around a PNG, per-side or uniform — Canvas. |
HEIC to JPG / PNG (/tools/heic-to-jpg) |
Convert iPhone HEIC/HEIF photos to JPG/PNG, batch + zip — heic-to (libheif wasm), lazy-loaded. |
Merge PDF (/tools/merge-pdf) |
Combine and reorder multiple PDFs into one — pdf-lib. |
Split PDF (/tools/split-pdf) |
Extract page ranges / split into single pages — pdf-lib + fflate zip. |
Images → PDF (/tools/images-to-pdf) |
Combine images into one PDF, fit-to-image or A4 — pdf-lib. |
PDF → Image (/tools/pdf-to-image) |
Render PDF pages to PNG/JPG at 1–3×, download individually or as a zip — pdfjs-dist. |
Compress PDF (/tools/compress-pdf) |
Shrink scanned/image-heavy PDFs by flattening pages to JPEG — pdfjs-dist + pdf-lib. |
QR Code Generator (/tools/qr-code) |
Custom colours + optional center logo, PNG/SVG — qrcode. |
Screenshot Beautifier (/tools/screenshot-beautifier) |
Gradient/solid bg, padding, radius, shadow, window bar — Canvas. |
Favicon Generator (/tools/favicon-generator) |
Full favicon pack (.ico + PNGs + manifest + HTML) zip — Canvas + fflate. |
Remove Background (/tools/remove-background) |
Transparent-PNG cut-outs via an in-browser AI model — @imgly/background-removal. |
PayNow QR Generator (/tools/paynow-qr) 🇸🇬 |
SGQR PayNow code from a mobile/UEN, optional fixed amount + reference — qrcode. |
GST Calculator (/tools/gst-calculator) 🇸🇬 |
Add/remove Singapore GST (9%). |
JSON Formatter (/tools/json-formatter) |
Format, validate, minify JSON. |
Base64 Encode / Decode (/tools/base64) |
UTF-8-safe text ↔ Base64. |
URL Encode / Decode (/tools/url-encode) |
Percent-encode/decode URL text. |
JWT Decoder (/tools/jwt-decoder) |
Decode JWT header/payload + timestamps (no verify). |
Hash Generator (/tools/hash-generator) |
MD5 + SHA-1/256/384/512 of text. |
UUID Generator (/tools/uuid-generator) |
Bulk v4 UUIDs. |
Case Converter (/tools/case-converter) |
camelCase, snake_case, kebab, slug, etc. |
Text Diff (/tools/text-diff) |
Line-by-line LCS diff. |
Add more by appending to lib/tools.ts (set status: "soon" for roadmap cards).
The Singapore category is the localized moat — keep its figures (GST, tax,
CPF) current and dated, since they change yearly.
- Next.js 16 (App Router, Turbopack) — all routes static except the
/ogimage route - React 19, TypeScript
- Tailwind CSS v4 with semantic design tokens in
app/globals.css - Motion (Framer Motion) for the landing animations
- pdf-lib (PDF), Canvas API (images) — all client-side
- lucide-react icons, Hanken Grotesk + JetBrains Mono fonts
- Vitest for unit tests
- @vercel/analytics + @vercel/speed-insights (cookieless). Enable Web Analytics once in the Vercel dashboard (Project → Analytics) to collect data.
- Dynamic social cards:
app/og/route.tsxrenders a branded OG image per tool; each tool page setsopenGraph.imagesto/og?title=…&cat=…. - Every tool page ends with a Related tools block (
relatedTools()inlib/tools.ts) for internal linking — same category first, then others. - Per-tool metadata + FAQ JSON-LD +
sitemap.xml+robots.txt.
npm install
npm run dev # http://localhost:3000
npm test # unit tests (lib/*.test.ts)
npm run lint
npm run build- Add an entry to
TOOLSinlib/tools.ts(setstatus: "live"). - Put pure, testable logic in
lib/(add a*.test.ts); keep browser/Canvas calls in their own client helper. - Build the interactive client component in
components/<tool>-tool.tsx. - Create
app/tools/<slug>/page.tsx— a server component that exportsmetadataand renders<ToolShell tool={...} faqs={...}>.
The homepage grid, footer, sitemap and JSON-LD all read from the registry automatically.
- Push to GitHub and import into Vercel — no environment variables needed.
- Update
SITE.urlinlib/site.tsto your production domain (used by metadata,sitemap.xml,robots.txt, and JSON-LD).
A favicon is included (app/favicon.ico + app/icon.svg).
Contributions are welcome! Please open an issue first to discuss what you'd like to change.
- Fork the repo
- Create a feature branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -m 'feat: describe change') - Push and open a pull request
Before submitting a PR, make sure npm test, npm run lint, and npm run build
all pass. See AGENTS.md for architecture and conventions, and the
Add a new tool section above for the tool-authoring workflow.
This project follows the Contributor Covenant v2.1. By participating you agree to uphold a welcoming, harassment-free environment.
Distributed under the MIT License. See LICENSE for details.
Built on the work of these open-source projects:
- Next.js & React — app framework
- Tailwind CSS — styling
- Motion — landing animations
- pdf-lib & pdf.js — PDF read/write/render
- @imgly/background-removal — in-browser background removal
- heic-to — HEIC/HEIF decoding (libheif wasm)
- qrcode — QR generation
- fflate — client-side zipping
- Lucide — icons
- Wikimedia Commons — free-image search source