JavaScript beautifier and formatter

How to beautify JavaScript

Paste minified or messy JavaScript into the input pane and click Convert. Prettier's Babel parser reads it in your browser and prints it again with two-space indentation, double quotes, semicolons and line breaks at 80 characters. Minified bundles become readable again, though the short variable names a minifier created stay short. Copy the code or download it as a .js file.

Why beautify JavaScript

Reading minified bundles or messy code is slow and easy to get wrong. Formatting brings back the structure so you can follow it and debug it.

Modern syntax support

It understands modern JavaScript and JSX. Arrow functions, template literals and destructuring all format correctly.

When to use it

Read the source of a bookmarklet, a third-party embed script or a production bundle while you debug, check what a minified library actually does, or tidy code copied from a chat or a blog post. Browser developer tools also have a pretty print button, but this works on code that isn't loaded in a page, and you can copy or download the result.

Before you start

Input: JS, MJS, and JSX. Output: Formatted JavaScript. The settings appear before anything runs, so you can check them first. Your original file is never changed.

The value you enter is processed in your browser. Still test the output where it will be used. Clean formatting does not prove the data is safe or correct.

Keep the original until you have opened and checked the result. The work happens in this browser tab, so the size you can handle depends on your device's memory, your browser and the file itself.

How to use the JavaScript beautifier and formatter

1. Paste your JavaScript into the input pane.
2. Click Convert to format it.
3. Copy the code or download it as a .js file.