Free Online JavaScript Formatter
Beautify or minify JavaScript with configurable indentation.
Beautifying uses js-beautify from a CDN, with a built-in fallback if the library cannot load. Minifying removes comments and optional whitespace only; it never renames variables or changes syntax on purpose. Review minified output before shipping it.
About the JavaScript Formatter
JavaScript that reaches a browser is frequently compressed, concatenated, or generated by a bundler. The code still works, but reading it becomes a chore: every statement sits on one long line, indentation is gone, and a single function can stretch across several screens. This formatter turns that dense block back into structured source that you can scan, copy from, or debug. It also works in the opposite direction, stripping comments and unnecessary whitespace when you want a compact snippet for a bug report, a bookmarklet, or a quick test.
Beautify or minify?
- Beautify: inserts line breaks and indentation so control flow, object literals, and nested callbacks become visible. This mode is best for inspection, teaching, and code review.
- Minify: removes comments, collapses runs of whitespace, and trims spaces around punctuation. The result is smaller and still semantically identical, assuming the original code was valid.
The beautifier understands strings, template literals, regular expression literals, and comments, so it does not reflow text inside them. Indentation can be two, four, or eight spaces, or a real tab to match an existing project. Preserving blank lines keeps intentional separation between sections, while disabling that option produces a tighter, more uniform file. The output box reports character and line counts so you can compare the before and after size.
Minification here is deliberately conservative. It does not rename identifiers, fold constants, drop unused functions, or rewrite expressions, because those transformations belong to a dedicated build tool such as esbuild, Rollup, or Terser. Instead, this formatter focuses on whitespace and comments, which makes the result easy to audit. A short regular expression or a template literal containing unusual characters is left intact. If a file relies on automatic semicolon insertion, keep the statement terminators in place before minifying.
Neither mode contacts a server. The page loads the open-source js-beautify library once, then processes your text inside the browser, so proprietary code, credentials accidentally pasted into a snippet, and internal endpoint names never leave your machine. When the CDN is blocked by a corporate proxy or an offline environment, a simpler built-in formatter takes over and warns you that its output is less polished.
How to use this tool
- Paste JavaScript into the input panel, or load the sample to see the expected shape.
- Pick an indentation width and decide whether blank lines should survive.
- Click Beautify for readable code or Minify for a compact version. The output also refreshes as you type after a short pause.
- Copy the result to the clipboard or download it as a .js file.
Frequently asked questions
Can minifying break my code?
Whitespace and comments are not significant in most JavaScript contexts, so a careful minifier should be safe. Edge cases involve automatic semicolon insertion, regular expressions, and code that depends on source text. Always run your test suite against the minified build before deploying it.
Why is the beautified output wider than I expected?
Some expressions, such as long chained promises or deeply nested object literals, naturally occupy many columns. The formatter avoids arbitrary line wrapping because breaking a chain in the wrong place can change how a reader understands it. Split the expression yourself when a line feels too dense.
Is my source code uploaded anywhere?
No. The only network request is the initial download of the js-beautify library from its public CDN. Your JavaScript is parsed locally and is never transmitted to this site or to any third party.