About This Tool
A powerful online code formatter that supports multiple programming languages including JavaScript, TypeScript, Python, JSON, HTML, CSS, XML, YAML, and Markdown. Simply paste your code or upload a file, select your language, and get beautifully formatted code instantly.
NinjaFunction's Code Formatter & Beautifier takes messy, minified or badly indented code and lays it out cleanly in your browser. JavaScript, TypeScript, JSON, HTML, CSS, YAML and Markdown are formatted with Prettier, the formatter many teams already run in their editors. XML and Python get simpler built-in indenters. Paste code or drop a file, and the formatted version appears about half a second after you stop typing.
What the Formatter Changes
- Indentation: two spaces per level for every language except Python, which uses four.
- Line length: lines longer than 80 characters are broken at sensible points.
- JavaScript and TypeScript style: single quotes, semicolons at the end of statements, spaces inside braces and trailing commas where ES5 allows them.
- Nothing else: the formatter only changes layout. It does not rename, reorder, sort or remove anything, so the code behaves exactly as before.
A Worked Example
Paste this one-line JavaScript snippet with JavaScript selected:
const user={name:"Asha",age:31,tags:["admin","editor"]};function greet(u){return "Hi "+u.name}
The output is:
const user = { name: 'Asha', age: 31, tags: ['admin', 'editor'] };
function greet(u) {
return 'Hi ' + u.name;
}
The object fits within 80 characters, so it stays on one line with spaces added. The function gets its own block with a two-space indent, the double quotes become single quotes and a semicolon closes the return statement.
A Note on Python
Python uses indentation to decide what belongs inside a block, so a formatter cannot safely guess where a block ends once the indentation is lost. The built-in Python indenter adds four spaces after every line that ends in a colon and steps back only for elif, else, except, finally and pass. If you paste
def total(items):
for item in items:
if item > 0:
print(item)
return sum(items)
the result puts return sum(items) inside the if block, because nothing tells the tool that the block has ended. Always read Python output before you use it, and for real projects run a dedicated formatter such as Black.
Common Mistakes
- Pasting code with a syntax error. Prettier has to understand the code before it can format it. A missing bracket or quote shows an error instead of output, so fix the error first.
- Choosing the wrong language. TypeScript pasted as JavaScript fails on type annotations. Pick the language yourself if the automatic choice looks wrong.
- Fighting your team's settings. If your project uses four-space indents or double quotes, the output will differ from your files. Use this tool for reading and quick clean-ups, and your project's own formatter for commits.
- Formatting minified code you plan to ship. Formatted code is bigger. Keep the minified version for production.
All formatting runs in your browser. Your code is never uploaded, which makes the tool safe for private and client work.