Code Beautifier

Paste minified or messily formatted code in HTML, CSS, SCSS, LESS, JavaScript, TypeScript, JSON, XML, YAML, or GraphQL, and get it back properly indented and readable — one tool covering formats that would otherwise each need their own separate formatter.

Rather than bouncing between several single-purpose formatting tools depending on what language you’re working with at the moment, this one auto-detects the language from the pasted content and applies the right formatting rules — convenient specifically when you’re jumping between file types during a debugging session or code review and don’t want to hunt for a different tool each time.

Paste your code and the language is detected automatically, with a manual override available if detection guesses wrong on ambiguous input (like a JSON file that could also look like a JS object literal). Set your indent width — 2 spaces, 4 spaces, or tabs — and a wrap length if you want long lines broken up, and the formatted output updates instantly with syntax highlighting. Invalid JSON, XML, or YAML gets flagged with the exact line and column where parsing failed, instead of just a generic error.

A minify toggle strips comments and collapses whitespace using the same engine, for a quick size check or for squeezing a snippet under a character limit. It’s a lightweight, safe minifier — not a substitute for a real build-step minifier when you need maximum compression for production (see the FAQ below on how the two differ). Every run shows the before/after byte size and percentage saved.

You can also drop a file straight in instead of pasting, and download the formatted (or minified) result afterward with the right file extension attached automatically. A draft of whatever you were working on is remembered in your browser, so an accidental refresh doesn’t lose your place.

Frequently asked questions

How accurate is the automatic language detection?

It’s reliable for the large majority of real-world pastes, since most languages have distinguishing syntax markers — CSS’s curly-brace-and-colon rule structure versus JSON’s strict key-value quoting, for example. Genuinely ambiguous edge cases exist, which is why the manual language override is there as a fallback rather than trusting detection blindly every time.

Is this the same as the dedicated JSON formatter or the HTML/CSS/JS minifier tools on this site?

It covers overlapping ground, but in one combined interface spanning more languages. If you’re working specifically and only with JSON, the JSON formatter offers more JSON-specific features like duplicate-key detection and auto-repair that this broader multi-language tool doesn’t focus on. Likewise, the dedicated minifier tool aims for maximum production-grade compression on HTML/CSS/JS specifically; this tool’s minify option is intentionally lighter-weight (comments and whitespace only) so the same one interface can apply it consistently across ten different languages, including ones a dedicated minifier wouldn’t normally touch, like YAML or GraphQL.

Does formatting ever change what the code actually does?

No — in Beautify mode, only whitespace, indentation, and line-wrapping change. In Minify mode, only comments and insignificant whitespace are removed, and the comment/whitespace stripper is string-aware, so it won’t touch anything that looks like a comment marker inside an actual string value. The code’s logic and behavior remain identical before and after.

Can it handle a file that mixes multiple languages, like an HTML file with embedded CSS and JS?

Yes — embedded <style> and <script> blocks within HTML are recognized and formatted according to their respective language’s rules while keeping the surrounding HTML structure intact.

Does it validate my code, or just reformat it?

Both, depending on the language. JSON, XML, and YAML have to be structurally valid to format at all, so a parsing mistake there is caught immediately with a line and column number. HTML, CSS, SCSS, LESS, JavaScript, TypeScript, and GraphQL are formatted more leniently — the tool will do its best to reformat what you paste, but it isn’t a linter and won’t necessarily flag a subtle syntax mistake in those languages the way it will for the stricter, data-only formats.

Does anything ever leave my browser?

No. Parsing, formatting, and minifying all run locally in your browser; nothing you paste or drop in is uploaded anywhere.