JavaScript Formatter

Beautify JavaScript and JSX, powered by Prettier.

This free online JavaScript formatter paste-and-goes — invalid syntax shows a clear error, valid code comes back consistently indented. No signup, runs entirely in your browser.

Indent

Quotes

Semicolons

Line width

JavaScript Input

Formatted

Loading formatter…

What does a JavaScript formatter do?

A JavaScript formatter rewrites your code with consistent spacing, indentation, and line breaks without changing what it does — turning cramped or inconsistently-styled code into something readable. This tool runs Prettier, the formatter most JavaScript teams already use, entirely in your browser.

Why Prettier

Prettier is an opinionated formatter — it makes most style decisions for you (where to break lines, how to wrap function arguments, when to add parentheses) rather than offering endless configuration. That's a feature: the output is deterministic and consistent no matter who wrote the original code, which is why so many teams run it automatically on save or in CI.

The options that matter

Indent width and quote style are largely a matter of team convention — Prettier defaults to 2 spaces and double quotes. Semicolons is a genuine style debate (Prettier defaults to on); turning it off relies on JavaScript's automatic semicolon insertion, which is safe as long as you're consistent. Line width controls when Prettier starts wrapping long expressions onto multiple lines — 80 is Prettier's default, though many teams use 100 or 120 for wider screens.

JSX and modern syntax

The formatter uses Prettier's Babel parser, the same one used for plain JavaScript files in most Prettier setups — it understands JSX, optional chaining (?.), nullish coalescing (??), class fields, and other current ECMAScript syntax without any configuration.

Frequently asked questions

Paste your JavaScript or JSX into the input — the formatted result appears automatically on the right. Adjust indent width, quote style, semicolons, and line width from the options panel.

Prettier — the same widely-used code formatter many teams run in their editors and CI, running entirely client-side via its official standalone browser build. The formatting output matches what you'd get running Prettier locally.

Yes — it uses Prettier's Babel parser, which handles JSX and current ECMAScript syntax (optional chaining, nullish coalescing, class fields, and more).

No. Formatting runs locally in your browser via Prettier's client-side build — nothing you paste is ever sent anywhere.

Related tools: Minify JS · JSON Formatter · HTML Formatter