UTILS.
100% in-browser
🎨

JavaScript Beautifier / Formatter

Pretty-print minified or messy JavaScript and JSON with consistent indentation, spacing, and line breaks — a hand-written formatter that runs fully in-browser.

— output appears here —

About this tool

The JavaScript Beautifier reformats minified, one-line, or inconsistently indented JavaScript and JSON into clean, readable source with uniform indentation and spacing. It is handy for reading a bundled library, tidying a copied snippet, or inspecting a JSON blob. Everything happens in your browser — the code is only reformatted as text, never executed, so there is no eval, no new Function, and nothing is uploaded.

The formatter is a hand-written tokenizer, not a regex hack: it scans the source into tokens while correctly skipping over the interiors of strings, template literals, regular expressions, and line/block comments, so quotes and slashes inside those are never mistaken for structure. A classic lookbehind heuristic distinguishes a division operator from a regular-expression literal. The token stream is then re-emitted with newlines after '{', '[' and ';', dedented lines before '}' and ']', one item per line inside object and array literals, and a single space around operators and after keywords.

Choose an indent of 2 spaces, 4 spaces, or a tab, and a brace style: collapse keeps the opening brace on the same line (K&R / 1TBS), while expand moves it onto its own line (Allman). Because the tool preserves string and regex contents byte-for-byte, the reformatted code is semantically identical to the input. Copy the result straight into your editor.

Frequently asked questions

Does it run or evaluate my code?
No. The beautifier only tokenizes and re-emits your source as text. It never calls eval or new Function and never executes the code, so pasting untrusted or proprietary JavaScript is safe. All work stays in your browser.
Does it work on JSON too?
Yes. JSON is a subset of JavaScript syntax, so pasting a minified JSON object or array reflows it into indented, one-key-per-line form. Strings, numbers, and nested structures are formatted the same way as in JavaScript.
What is the difference between the brace styles?
Collapse (K&R / 1TBS) keeps the opening brace on the same line as the statement, e.g. 'if (x) {'. Expand (Allman) puts the opening brace on its own line beneath the statement. Both produce identical, valid code — only the layout differs.
Will it change what my code does?
No. Only whitespace, indentation, and line breaks change. The contents of strings, template literals, and regular expressions are preserved exactly, so the reformatted output is functionally identical to the original source.

More tools