devmicrotools.com — free developer utilities (JSON formatter,
regex tester, Base64, JWT decoder, hashing, diff checker, QR codes, and more) that run
entirely in your browser.
There is no backend. Every tool is client-side JavaScript, and nothing you paste into a
tool is ever sent to us. Two tools are an explicit exception: cURL Command Builder's "Send
request" and Bundle Size Checker's "Check size" / "Check all dependencies" fire a real
request straight from your browser to a third party (the URL you built, or the public npm
registry/esm.sh) — but only when you press that specific button, never on page load or
keystroke, and never through any server of ours. Every other tool never makes a network
request at all. You can verify this yourself: open DevTools → Network while using any tool.
Within each category, tools are ordered by importance (highest first) — the same order
used on the site's homepage directory. Related tools are kept adjacent (e.g. the two Cron
tools, the three CSS generators).
| Tool |
Description |
| Docker Run ↔ Compose Converter |
Convert a docker run command into a compose service, or a compose service back into a docker run command. |
| Base Converter |
Encode and decode Base64, Base32 and Base58 in one tool — text or file, with format-specific options for each. |
| URL Encoder & Decoder |
Percent-encode or decode URLs, and break one down into its parts. |
| Timestamp Converter |
Convert Unix epoch timestamps to dates and back, with a live current time. |
| Color Converter |
Convert between HEX, RGB, HSL and OKLCH, with WCAG contrast checking. |
| Chmod Calculator |
Convert Unix file permissions between octal (755) and symbolic (rwxr-xr-x) notation, with checkboxes and setuid/setgid/sticky bits. |
| JSON, YAML, CSV & XML Converter |
Convert data between JSON, YAML, CSV and XML in either direction. |
| JSON & XML to Types |
Turn a JSON or XML sample into TypeScript, Go, Java, C#, Kotlin, Swift, Rust or Python type definitions, with nested objects and optional fields inferred. |
| Tool |
Description |
| JSON Formatter |
Beautify, minify, validate and repair broken JSON entirely in your browser. |
| HTML / CSS / JS Minifier |
Shrink HTML, CSS or JavaScript by stripping comments and unnecessary whitespace. |
| SQL Formatter |
Beautify a SQL query with consistent indentation and keyword casing. |
| XML Formatter |
Pretty-print, minify, validate, or convert XML to JSON — all in the browser. |
| Markdown Previewer |
Live-preview Markdown as HTML, or convert HTML back into Markdown, right in your browser. |
| Tool |
Description |
| QR Code Generator |
Turn text or a URL into a scannable QR code — download as PNG or SVG. |
| UUID Generator |
Generate v4 or time-ordered v7 UUIDs in bulk, and inspect existing ones. |
| Lorem Ipsum Generator |
Generate Lorem Ipsum placeholder text as paragraphs, sentences or words. |
| Fake Data Generator |
Generate realistic fake names, emails, addresses and more as JSON or CSV. |
| Barcode Generator |
Turn text or digits into a real, scannable Code 128, Code 39, EAN-13, or UPC-A barcode. |
| cURL Command Builder |
Turn a method, URL, headers, body and auth into a correctly-escaped curl command. |
| Slug Generator |
Turn a title into a clean, URL-friendly slug — separator, casing and length options. |
| Meta Tag & Open Graph Generator |
Build SEO, Open Graph and Twitter Card meta tags for a page, with a live search-result and social-card preview. |
| JSON-LD Schema Generator |
Build Article, Product, FAQ, How-to, Organization or Breadcrumb structured data from a form. |
| Mermaid Diagram Generator |
Write Mermaid syntax and see the diagram render live — flowcharts, sequence diagrams, ER diagrams, Gantt charts and more. |
| Tool |
Description |
| Password Generator |
Create strong random passwords with adjustable length and character types. |
| Hash Generator |
Compute MD5, SHA-1 and SHA-2 digests, and verify a checksum against them. |
| JWT Debugger |
Decode, verify and sign JSON Web Tokens without uploading them anywhere. |
| Bcrypt Generator |
Generate a bcrypt hash from a password, or verify a password against one. |
| CSP Header Builder & Analyzer |
Build a Content-Security-Policy header from a form, or paste one to get it linted and explained. |
| security.txt Generator |
Build a standards-compliant security.txt file (RFC 9116) with validated Contact and Expires fields. |
| Tool |
Description |
| Regex Tester |
Test regular expressions with live highlighting, groups and replace preview. |
| Word Counter |
Count words and characters, convert text case, and find and replace text. |
| Diff Checker |
Compare two texts or JSON documents and see exactly what changed. |
| Case Converter |
Convert text between nine common casing styles, plus a smarter AI-assisted Sentence case. |
| Duplicate Line Remover |
Find duplicate lines, sentences, or paragraphs and remove one, some, or all of them. |
| Invisible & Homoglyph Inspector |
Find zero-width characters, bidi overrides, odd whitespace and Latin-lookalike homoglyphs, then clean them. |
| ASCII Text Banner Generator |
Convert any text into big block-letter ASCII art — pick the fill character, size and spacing, then copy or download. |
| Tool |
Description |
| Bundle Size Checker |
Check an npm package's real gzipped size, README and project health, or size a whole package.json at once. |
| ASCII, Unicode & Keycode Inspector |
Look up any ASCII or Unicode character by code, hex, or name, and inspect a live keyboard event's key, code, keyCode and modifiers as you press it. |
| Cron Expression Explainer |
Explain a cron expression in plain English and see its next run times. |
| Cron Expression Generator |
Build a cron expression from simple field controls instead of writing the syntax by hand, with a live plain-English description and next run times. |
| CIDR / Subnet Calculator |
Calculate network address, broadcast address, host range and mask from a CIDR block. |
| User-Agent Parser |
Parse a User-Agent string into browser, OS, rendering engine and device type. |
| URL Parser |
Decompose a URL into its parts and edit its query parameters live. |
| Browser Fingerprint Inspector |
See what your browser's JavaScript reveals (fonts, canvas/WebGL, permissions, timezone) and what the server already saw on the request (IP, geo, headers). |
| Tool |
Description |
| Image Compressor |
Compress JPEG, PNG, or WebP images in your browser — batch multiple files, compare before/after, download as a zip. |
| Background Remover |
Remove a photo's background with an on-device AI model (u2netp via onnxruntime-web/WASM) — no upload, runs entirely in your browser. |
| Image Format Converter |
Convert one or many images between PNG, JPEG, WebP, BMP and ICO — including SVG rasterization — right in your browser. |
| Favicon Generator |
Generate favicon.ico, every standard PNG size, apple-touch-icon, Android/PWA icons and a web manifest — plus the HTML snippet — from one uploaded image. |
| Image Cropper |
Crop an image to a selected area and resize it to exact pixel dimensions, right in your browser. |
| Image Upscaler |
Enlarge a photo 2x-8x with a sharp Lanczos resample — right in your browser, no upload required. |
| Image ↔ Base64 Converter |
Convert an image to base64 for inlining in CSS/HTML, or decode base64 back into an image. |
| SVG Optimizer |
Strip comments, metadata, and editor cruft from SVG markup — tune precision, compare before/after, download. |
| Face & Plate Blur |
Blur, pixelate, or black out faces (auto-detected on-device), license plates, or anything else sensitive in a photo — right in your browser. |
| ASCII Art Generator |
Convert an image into ASCII text art — pick the character set, width and contrast, then copy or download it. |
| Tool |
Description |
| CSS Gradient Generator |
Build linear, radial and conic gradients visually and copy the CSS. |
| Color Palette Generator |
Turn one colour into a full 50-950 tint/shade scale plus five colour-harmony sets, exportable as CSS, Tailwind, SCSS, or JSON. |
| CSS Box-Shadow Generator |
Build single or layered box-shadows visually and copy the CSS. |
- Astro — static output, zero JS shipped by default
- Preact islands for the interactive part of each tool page only
- TypeScript in strict mode
- Vitest +
@testing-library/preact for unit and component tests
- Deployed as static assets on Cloudflare Workers
src/
layouts/BaseLayout.astro # head/meta/JSON-LD, header, footer, analytics
components/ # Header, Footer, ToolCard, RelatedTools, AdSlot, ToolIsland, ...
content/tools/<slug>.mdx # per-tool metadata + written content (required by content.config.ts)
islands/<Tool>.tsx # one Preact component per tool — the interactive widget
lib/tools/<name>.ts # pure, framework-free, unit-tested logic
lib/toolRegistry.ts # slug -> component registration
pages/
index.astro # tool directory
[slug].astro # dynamic route over the content collection (tools live at /<slug>/)
llms.txt.ts # /llms.txt, generated from the content collection
public/ # robots.txt (AI crawler policy), ads.txt, favicon
Each tool keeps three concerns separate: pure logic (lib/tools/), UI/state (islands/),
and content (content/tools/). Adding a new tool is additive — one file in each of those
three places, plus a registry entry — never a change to another tool's code.
See AGENTS.md for the full set of engineering conventions this project follows
(performance budget, testing requirements, SOLID layering, SEO requirements) — the same file
guides both human contributors and AI coding agents working in this repo.
npm install
npm run dev # dev server at localhost:4321
npm run build # production build to dist/
npm run preview # serve the built site locally
npm run test # unit + component tests
MIT