JavaScript Formatter

Paste minified or messy JavaScript and get it back with clean indentation, line breaks, and spacing. Choose your quote style and indentation, or minify instead. Everything runs in your browser, so your code stays on your device.

Indent

Format supports JavaScript and JSX. Minify supports plain JavaScript. Style options apply to Format.

Result

What the JavaScript formatter does

JavaScript often ends up minified or crammed onto a few lines, which is hard to read and easy to make mistakes in. A formatter rewrites the code with clean indentation, one statement per line, and consistent spacing, so the structure is clear at a glance. It does not change what the code does, only how it is laid out. This tool formats your code with Prettier and can also minify it when you want a smaller copy.

Why use our JavaScript formatter

  • ·Free. No signup, no paywall.
  • ·Runs in your browser. Your code is never uploaded, so it is safe for private projects.
  • ·Powered by Prettier. The output matches what most projects and editors already produce.
  • ·Your code style. Choose the indentation, quotes, and whether to add semicolons.
  • ·Syntax highlighting. The editor colours your code so it is easy to scan as you work.

JavaScript formatting options

Format JavaScript

Rewrites your code with clean indentation, line breaks, and spacing using Prettier. Long, minified, or messy code becomes easy to read and review.

Beforefunction f(a){return a*2}Afterfunction f(a) { return a * 2; }

Minify JavaScript

Removes comments and extra whitespace with Terser to make a compact copy of plain JavaScript. Variable and function names stay the same. JSX is not supported by Minify.

Before// double it const double = x => x * 2;Afterconst double=x=>x*2;

JavaScript semicolons

Adds semicolons at the end of statements. Turn it off to omit optional semicolons. Prettier still adds them where needed to keep the code working.

Beforeconst x = 1Afterconst x = 1;

Quotes and indentation

Prefer single or double quotes for strings and choose 2 or 4 spaces per level. Prettier may use the other quote style to avoid extra escapes. These settings apply to Format.

Beforelet s = "hi"Afterlet s = 'hi';

When to format JavaScript

A formatter helps any time code is hard to read. These are the cases that come up most:

  • ·Reading minified code. Paste a minified script or bundle to see its structure again.
  • ·Cleaning up before review. Format code so a teammate can read it in a pull request.
  • ·Cleaning up a JavaScript snippet. Fix the spacing on code you pasted from a chat or a web page.
  • ·Learning JavaScript. See how code breaks into clear lines while you are still learning.

Run Prettier on your own JavaScript project

This tool formats with Prettier, the most widely used JavaScript formatter. To get the same result across a whole project:

ToUse
Format every filenpx prettier --write .
Check without changing filesnpx prettier --check .
Match the settings used hereAdd "tabWidth", "semi", and "singleQuote" with your choices to a .prettierrc file
Format when you saveInstall the Prettier extension in VS Code and turn on Format On Save

Anything you do not set here uses Prettier's defaults: lines wrap at 80 characters, and trailing commas are added wherever JavaScript allows them.

For JSON data, use theJSON formatter and validator. For markup, use the HTML formatter and beautifier.

JavaScript formatter questions

What is a JavaScript formatter?
A JavaScript formatter takes code that is minified or has messy spacing and rewrites it with clean indentation, line breaks, and consistent spacing. It does not change what the code does, only how it looks, so it is easier to read, review, and debug.
How do I format JavaScript code?
Paste your code into the input box, pick your indentation and quote style, then click Format. The clean version appears below. Click the copy button to copy it, or download it as a .js file.
Does the formatter change my code?
Format rewrites code in a consistent style while preserving its behavior. Minify removes comments and extra whitespace without renaming variables or optimizing your logic. Neither action runs your code.
What does it use to format the code?
It uses Prettier, the widely used code formatter, running in your browser. That means the output matches what most projects and editors produce, with no setup and no install.
Can it read modern JavaScript and JSX?
Format supports modern JavaScript, including arrow functions, classes, async and await, template strings, and JSX. Minify supports plain JavaScript only. TypeScript types must be removed before using either action.
Is my code kept private?
Yes. Formatting and minifying run in your browser. This tool does not upload or store your code. It downloads its formatting libraries when you first use each action, so the first use needs an internet connection.