JavaScript Formatter
Turn minified or messy JavaScript into readable, consistently indented code.
Formats (beautifies) code only: it does not minify it, run it, or check that it is valid.
The input has changed since this result was made — format again to update it.
About the JavaScript Formatter
Paste minified or badly indented JavaScript and get it back with one statement per line, consistent indentation and readable spacing. It handles modern syntax — arrow functions, classes, async/await, template literals, optional chaining — and leaves JSX markup as you wrote it. JSON works too.
This is a beautifier: it changes only whitespace and line breaks. It does not minify, run or validate code — invalid code is formatted as well as possible rather than rejected — and nothing you paste leaves your browser.
How to use it
- Paste code, drop a
.js,.jsxor.jsonfile onto the box, or use Open file. - Choose indentation, brace style, how many blank lines to keep and whether to wrap long lines.
- Press Format code (Ctrl/⌘ + Enter). Options under More options apply as soon as you change them.
- Copy the result or download it — an opened file keeps its extension.
Examples
const total=items.reduce((sum,{price,qty})=>sum+price*qty,0);if(total>1000){applyDiscount(0.1)}else{console.log('No discount')}const total = items.reduce((sum, {
price,
qty
}) => sum + price * qty, 0);
if (total > 1000) {
applyDiscount(0.1)
} else {
console.log('No discount')
}Turn on Keep one-line blocks on one line to keep short objects such as { price, qty } together when they were written on one line.
function greet(name){if(!name){return 'Hello!'}return `Hello, ${name}!`}function greet(name)
{
if (!name)
{
return 'Hello!'
}
return `Hello, ${name}!`
}{"id":7,"tags":["a","b"],"owner":{"name":"Asha"}}{
"id": 7,
"tags": ["a", "b"],
"owner": {
"name": "Asha"
}
}To validate JSON or sort its keys, use the JSON Formatter.
Common uses
- Reading minified or bundled JavaScript from a website or an npm package while debugging.
- Making code from chat messages, emails or Stack Overflow answers readable before using it.
- Re-indenting snippets with a consistent brace style before pasting them into documentation.
- Pretty-printing JSON or JavaScript objects copied from logs.
Formatting, not minifying or checking
The formatter re-spaces and re-indents code without parsing it the way a compiler does. That makes it fast and tolerant — half-finished or invalid code still comes out readable — but it also means it will not tell you about syntax errors. Use your editor, node --check file.js or a linter such as ESLint for that.
To make code smaller for production, use a minifier in your build, such as esbuild or Terser. This page deliberately does not offer a JavaScript minifier, because doing that safely needs a full parser.
JSX and TypeScript
- JSX: with Keep JSX markup as written on (the default), tags such as
<Button onClick={…}>are kept exactly as you wrote them and the JavaScript around them is formatted. - TypeScript: it is formatted as JavaScript. Most code keeps working: annotations such as
name: stringare fine, and generics and optional members only get extra spaces (Array < string >,age ? : number). Some syntax breaks, though: the generic arrow function<T,>(x: T): Promise<T> => xcomes out asPromise < T >= >, andas constright after an object is moved onto lines of its own. When the code looks like TypeScript the page says so; check the result, or use Prettier, which understands TypeScript.
Limitations
- Formatting is done by the open-source js-beautify engine. It changes whitespace and line breaks only — and, if you turn on Decode \xNN and \uNNNN escapes, escapes of printable characters in strings (
\x41becomesA; quotes and backslashes stay escaped). - Code that relies on automatic semicolon insertion in unusual places can be laid out oddly. Review the result before replacing your original.
- Very large files are processed in a background thread so the page stays responsive; on older phones several megabytes can take a few seconds.
Privacy
Everything happens in your browser. What you enter or open here is not uploaded or stored by MySmartCoPilot.
Frequently asked questions
Is my code uploaded anywhere?
No. Formatting happens in your browser and your code is never sent to a server. It is also never run — the page only treats it as text.
Can formatting change what my code does?
For JavaScript it only changes whitespace and line breaks, which JavaScript ignores between tokens — apart from rare cases that depend on automatic semicolon insertion, so review the result before replacing your original. Strings, template literals and regular expressions are kept as written; comments may be re-indented. TypeScript is different: some of its syntax can break (see “JSX and TypeScript” above).
Does it check my code for errors?
No. It formats whatever you paste, even if it is incomplete or invalid, so a clean result does not mean the code runs. Use a linter or node --check to find syntax errors.
Can it minify JavaScript?
No. Safe minification needs a full JavaScript parser; use esbuild or Terser in your build. This tool focuses on making code readable.
Which brace style should I pick?
Same line (K&R) is the most common style in JavaScript — it is what Prettier and most style guides use. Own line (Allman) matches C# and many C/C++ codebases.