I Built a Privacy-First Developer Toolbox That Runs 100% in Your Browser

Every developer has a handful of tools they reach for daily: a JSON formatter, a Base64 decoder, a timestamp converter. I got tired of pasting sensitive data into random websites that "promise" not to store it, so I built my own.

DevTools is a collection of 8 developer tools that run entirely client-side. No server uploads. No data collection. Everything happens in your browser tab.

What's Inside

• JSON Formatter - Format, validate, and minify JSON with auto-detection of nested escaped strings

• Base64 Converter - Encode and decode Base64 with full UTF-8 and emoji support

• URL Encoder - Percent-encode/decode URLs with international character support

• JWT Decoder - Decode JSON Web Tokens locally without ever sending your tokens to a server

• Timestamp Converter - Convert between Unix timestamps and human-readable dates

• UUID Generator - Generate cryptographically secure UUID v4 in bulk

• Hash Generator - Calculate MD5, SHA-256, and SHA-512 hashes

• Regex Tester - Test and debug regular expressions with live matching and replacement

Why Client-Side Matters

Think about what you paste into online tools every day:

• JWT tokens containing user IDs and permissions

• API responses with customer data

• Configuration files with connection strings

• Hashed passwords you're debugging

Most online tools send your input to a server for processing. Even if they don't log it intentionally, your data passes through their infrastructure. With client-side processing, the data literally cannot leave your machine.

You can verify this yourself: open the Network tab in your browser's DevTools while using any tool. You'll see zero outbound requests after the page loads.

Tech Stack

• Next.js 16 with static export (output: "export")

• React 19 for the UI

• Tailwind CSS 4 for styling

• CodeMirror for the code editors with syntax highlighting

• Web Crypto API for hash generation (not a JS polyfill)

• Deployed on Cloudflare Pages for global edge delivery

The static export means the entire site is pre-rendered HTML + JS. No server-side runtime, no API routes, no database. Just files served from Cloudflare's CDN.

A Few Things I'm Proud Of

Nested JSON detection: The JSON formatter auto-detects and recursively parses escaped JSON strings. If you have a log line where JSON is double-escaped ("{"key":"value"}"), it will unwrap it for you.

Hex UTF-8 decoding: Paste a string with \xE4\xB8\xAD and the formatter converts it to the actual Chinese character. Useful when debugging logs from Go or Python services.

Theme system: 7 built-in themes (Midnight, Dracula, Nord, Monokai, GitHub Dark, Solarized, Light) with instant switching and localStorage persistence. The theme loads before React hydrates, so there's no flash of wrong colors.

Cmd+K command palette: Quick-jump to any tool without touching the sidebar.

What's Next

I'm planning to add:

• Color picker / converter (HEX, RGB, HSL)

• Markdown previewer

• Diff tool (compare two text blocks)

• Cron expression parser

If you have suggestions for tools you'd find useful, I'd love to hear them in the comments.

Try it out: tools.ytlm.space