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
Top comments (0)