Code Formatter & Beautifier
Paste or open a file, press Format, get tidy code. The language is detected automatically — JavaScript, TypeScript, CSS, HTML, JSON, XML, SQL, YAML, Markdown and GraphQL, all in your browser.
Everything runs in your browser — your code is never uploaded to any server.
Line width applies to JavaScript, TypeScript, CSS, SCSS, LESS, HTML, YAML, Markdown and GraphQL. Formatting never checks logic, types or style rules.
The language is detected as soon as you add code.
Drop a code file here (up to 5 MB), paste, or load a sample. Press Ctrl+Enter to format.
Format and beautify code in your browser
Code that is copied from a minified bundle, a log, a chat message or an old project is hard to read and even harder to review. This Code Formatter turns it back into tidy, consistently indented text with a single click. Paste the code, press Format (or Ctrl+Enter), and the result appears next to the original, with line numbers on both sides so you can compare them at a glance.
The tool supports the formats developers meet most often: JavaScript with JSX, TypeScript with TSX, CSS, SCSS and LESS, HTML with its inline scripts and styles, JSON, XML, SQL for thirteen dialects, YAML, Markdown and GraphQL. By default the language is detected for you, from the file name when you open a file and from the text itself when you paste. If the text could be several things, the tool says so and offers the likely candidates instead of silently picking the wrong parser.
You stay in control of the style. Choose two spaces, four spaces or tabs, and a line width of 80, 100 or 120 characters for languages formatted with Prettier. For SQL you can pick the dialect, such as PostgreSQL, MySQL, SQL Server or BigQuery. For JSON there is also a Minify button that removes all whitespace without touching numbers, strings or the order of keys. Settings are remembered in your browser, and you can turn on automatic formatting if you prefer to see the result while typing.
When something is wrong, the message is short and exact: the language, what the parser expected, and the line and column. Your input is never overwritten, and a button moves the cursor to the problem. The Undo button brings back whatever you cleared or replaced by mistake, and you can download the result with the right file extension for its language, or open both versions side by side in the Text Diff Checker to see exactly what changed.
Everything happens on your device. The heavy formatting engines are downloaded only for the language you actually format, and they run in a background worker, so a large file does not freeze the page. Be aware of the limits: files up to 5 MB can be opened, inputs above 300,000 characters may take a few seconds, and inputs above two million characters are refused. Formatting is not a linter or a compiler, so it will not find logic errors, and a few exotic syntax features may be rejected.
Frequently asked questions
Is my code uploaded anywhere?
No. The code is formatted by libraries that run inside your browser, in a background thread. Nothing is sent to a server. Only your settings and an optional draft are kept in this browser's local storage, and you can clear the box at any time.
Will formatting change what my code does?
The formatter only changes layout: indentation, line breaks and spacing. It can also normalise quotes, add or remove optional parentheses and put semicolons in a consistent way, but the meaning stays the same. It does not check logic, types or lint rules, so correct code in gives correct code out, and wrong code stays wrong.
How does the language get detected?
If you open a file, its extension decides. Otherwise the tool looks at the text itself: tags, braces, keywords and typical punctuation. When two languages look alike, for example CSS and SCSS or JavaScript and TypeScript, it asks you instead of guessing. You can always pick a language by hand in the Language list.
What happens when my code has a syntax error?
The output stays empty, your input is left exactly as it was, and you get a short message with the line and column. Use the Show in input button to jump to that spot, fix it and press Format again.
Can I minify code here?
Only JSON, where removing whitespace is always safe. Minifying JavaScript or CSS properly needs a dedicated minifier, because renaming variables or merging rules can change behaviour, so this tool does not attempt it. For a deeper SQL syntax check, use the SQL Formatter & Validator.