JavaScript beautifier

Format pasted JavaScript or TypeScript.

FreeRuns in your browserNo signupUpdated 2026-10-29

Formatting only: nothing is renamed, reordered or evaluated. Type annotations, JSX and decorators are kept as written.

Lines

29

from 2 lines of input

Longest line

53

characters

formatted.js
const orders = [{
  id: 1,
  total: 1200,
  paid: true
}, {
  id: 2,
  total: 450,
  paid: false
}];

function summarise(list) {
  const paid = list.filter(o => o.paid);
  return {
    count: list.length,
    paidTotal: paid.reduce((s, o) => s + o.total, 0),
    unpaid: list.filter(o => !o.paid).map(o => o.id)
  }
}
export async function sendReminders(list) {
  for (const id of summarise(list).unpaid) {
    try {
      await fetch(`/api/remind/${id}`, {
        method: "POST"
      })
    } catch (err) {
      console.error("reminder failed", id, err)
    }
  }
}

About this tool

How it works and how to read the result.

Need this done for you?

Web app & SaaS development

SaaS products and web apps, from first version to scale.

See the service

What it does

A JavaScript beautifier reformats code so you can read it. Minified bundles, code pasted from a chat window, snippets from a CMS field and one-line functions all come out with consistent indentation, one statement per line and spaces around operators. Nothing is renamed, reordered or executed, and TypeScript syntax such as type annotations and interfaces is kept intact. Choose the indent size and brace style to match the file you are working in, then copy the result straight back into your editor.

How to use it

  1. Paste the JavaScript or TypeScript. A whole minified file is fine, though very large bundles take a moment.
  2. Pick the indent your project uses: two spaces, four spaces or a tab.
  3. Choose a brace style, then decide whether to keep blank lines from the input and add spaces inside parentheses.
  4. Copy the formatted code or download it as a .js file.

How to read the result

The sample is two lines of compressed code. Formatted with two-space indentation and collapsed braces it becomes 29 lines, which is what the "Lines" stat reports. Reading it, you can now see that the first function filters paid orders and builds a summary object, and that the second loops through unpaid order IDs and posts a reminder for each, with a try and catch around the request.

The "Longest line" stat flags lines over 120 characters in amber. Long lines after formatting are usually a long string, a chained promise or a deeply nested object literal; they are not errors, but they are the first place to look if the code is hard to follow.

If the output looks wrong, such as a whole block on one line, the input probably has a syntax error, often an unclosed template string or a stray backtick from copying. The formatter does its best rather than stopping, so check the input near that point.

Readable code is the baseline for any web application we maintain. For data rather than code, the JSON formatter does the same job for JSON.

Questions

Frequently asked.

Can it format TypeScript?

Yes, in the sense that type annotations, interfaces, generics and decorators are preserved and indented sensibly. The formatter works on syntax rather than types, so it does not check that the code compiles. For strict TypeScript style rules, run Prettier or ESLint in your project; this is for a quick tidy of pasted code.

Will it undo minification?

It restores line breaks, indentation and spacing, which makes minified code readable again. It cannot restore the original variable names, since those were replaced by short ones at build time and the originals are gone. If the site ships a source map, your browser's developer tools can show the original code.

Which brace style should I pick?

Collapse, where the opening brace stays on the same line, is what most JavaScript style guides and the default Prettier output use. Expand puts braces on their own line, which some teams coming from C# prefer. Pick whatever the rest of the file uses so the formatted block fits in.

Your next move

Like what you see? Tell us about it.

A process that takes too long, a website that undersells you, or an idea ready to take shape. Tell us where you are and we will suggest a useful next step.

India · Working with clients worldwide

We reply within a working day. No spam, ever.