JavaScript Formatter

Beautify common JavaScript source code with readable indentation and spacing for debugging, review and maintenance.

Ad space — place your AdSense unit here after approval.
Note: this is a pattern-based formatter. Check string literals, template literals and regular expressions in the output before using it in production.
Your result will appear here.

JavaScript Formatter online

Reformat JavaScript by its brace structure — blocks opened, closed and indented at two spaces per level — to make minified or pasted code readable again.

Quick answer: Beautify common JavaScript source code with readable indentation and spacing for debugging, review and maintenance.

How to use this tool

  1. Paste your JavaScript into the input box.
  2. Click Run Tool. Braces drive the layout: an opening brace starts an indented block, a closing brace ends it.
  3. Copy the formatted code from the result panel.

Common uses

Reading a minified snippet you are debugging, cleaning up code copied from a chat or forum answer, reviewing a small script without opening an IDE, and untangling nested callbacks and conditionals in legacy code.

How it works

The formatter is brace-driven and string-aware: it scans the code tracking whether it is inside a string (single, double or template quotes are all respected, so braces inside strings do not affect layout), then breaks lines at { and } and indents by depth. It does not parse the language — statements are not split at semicolons, and nothing is renamed, reordered or validated. The result is your code with its skeleton showing, not a reprint from an AST.

Worked example

The one-liner

function greet(n){if(n){return "Hi "+n}return "Hi"}

becomes

function greet(n) {
  if(n) {
    return "Hi "+n
  }
  return "Hi"
}

Note the closing braces landing on their own lines and the string contents passing through untouched.

Privacy and browser processing

Your code is formatted in your browser with JavaScript — it is never uploaded or stored.

Frequently asked questions

Why are my statements still on one line?

Lines break at braces, not semicolons, so several short statements between the same pair of braces stay together. The layout exposes block structure; splitting every statement is a full parser's job (Prettier and friends).

Can it handle regular expressions with braces?

Regex literals are not tracked the way strings are, so a pattern containing { or } (like /a{2,3}/) can throw the indentation off for what follows. If the layout goes crooked, check for brace quantifiers in regexes first.

Does it work on TypeScript or JSX?

Brace layout works the same, but angle brackets and generics are not understood as syntax — the output is usually still readable, though type annotations may sit awkwardly. Dedicated formatters remain better for those dialects.

Will it catch syntax errors?

No parser, no verdicts: invalid code is laid out as happily as valid code. Unbalanced braces do show up as indentation that never returns to the margin — often the fastest way to eyeball the problem.

Is my code uploaded?

No. Formatting runs in your browser; your code never leaves the page.

Related tools

Ad space