DEV Community

Cover image for I built a single tab that replaces 60+ dev tool websites — onHTML
mimturan
mimturan

Posted on

I built a single tab that replaces 60+ dev tool websites — onHTML

#webdev #javascript #html #showdev

TL;DR — I built onHTML — a single tab that bundles a live HTML / CSS / JS playground with 60+ built-in developer tools. No signup, no ads, 100% client-side. Free forever.

onHTML demo

The problem

For years I've kept a "dev tools" bookmark folder bigger than my whole node_modules. Every other minute:

  • Open that JSON formatter site
  • Hop over to another regex tester
  • Google "JWT decoder" again
  • "Where was that good cron builder…"
  • "Need a quick favicon, where was that one site?"

15+ tabs every day, each with its own ads, popups, dark patterns and "sign up to save" walls.

What I built

onHTML is one tab that replaces all of them:

  • A live HTML / CSS / JS playground with autosave & shareable snippets (think mini CodePen, no signup)
  • 60+ built-in dev tools across formatters, generators, converters, CSS, SEO and dev utilities
  • Multilingual UI (EN, ES, ZH, HI, FR, TR)
  • Everything runs in your browser — no backend, no telemetry, no upload
  • Free forever, no ads

What's actually inside

Formatters & validators
JSON · SQL · HTML/CSS/JS Beautifier · Markdown · JWT Decoder

Generators
UUID/ULID · QR Code · Hash (MD5, SHA-256, SHA-512) · Password · Favicon · Lorem Ipsum · Sitemap.xml · robots.txt · Schema.org JSON-LD · Meta Tags · Open Graph Preview

Converters
Base64 (text + files) · URL · cURL → Python / JS / PHP / Go · Tailwind ↔ CSS · HTML ↔ JSX · JSON ↔ YAML ↔ XML ↔ CSV · Markdown → HTML · Image → Base64 · SVG → PNG · Unix Timestamp · Number Base

CSS toolkit
Gradient · Mesh Gradient · Box Shadow · Glass · Border Radius · Cubic-Bezier visualizer · Loader generator · Color Palette · WCAG Contrast Checker

Dev utilities
Regex tester · Cron builder + visualizer · Diff (text & JSON) · Word counter · Slug · Case converter · HTTP Header inspector · AI Token Counter · Code Screenshot generator · Pomodoro

👉 Full list: onhtml.com/tools

Why client-side?

Every tool runs locally in the browser. That means:

  • Your code, JSON, tokens, etc. never leave your machine
  • Works offline once loaded
  • No rate limits, no "premium tier"
  • I don't need to operate any backend — site stays free forever

Stack (in case you're curious)

  • Vanilla JS + a thin component layer (no framework lock-in)
  • Heavier tools (SQL formatter, JSON tree explorer, etc.) lazy-load on demand
  • Deployed behind a CDN

What I'd love feedback on

I want this to be the tool I'd actually use daily, not a personal trophy. So:

  1. Which tool is missing? What do you keep googling?
  2. Anything obviously broken or slow?
  3. UX rough edges? I read every issue.

🔗 Site: https://onhtml.com
🔗 All tools: https://onhtml.com/tools
🔗 GitHub (issues & tool requests): https://github.com/mimturan/onhtml

If onHTML saves you a tab, a ⭐ on GitHub would genuinely make my week.

Thanks for reading — happy to answer anything in the comments.

Top comments (0)