How the JSON formatter works
Paste JSON into the left editor, pick an option from the indent menu, and click Format (or press Ctrl + Enter, Cmd + Enter on a Mac). The tool parses the text with JSON.parse and writes it out again with JSON.stringify using the indent you chose. Because the output is rebuilt from the parsed data rather than re-spaced line by line, any odd indentation, tabs, or line breaks in the input are thrown away and replaced with one consistent layout.
The line under the toolbar compares input and output size, so you can see what minifying saves. Click the arrow next to a line number in either editor to fold a large object or array.
Example: making a webhook payload readable
Webhook bodies and API responses usually arrive on a single line:
{"event":"order.shipped","id":"evt_81F3","created_at":"2024-06-10T14:02:11Z","order":{"number":"A-1042","total":149.5,"currency":"EUR","items":[{"sku":"KB-01","qty":1},{"sku":"MS-02","qty":2}],"shipping":{"method":"ground","tracking":"TRK-58310042"}},"test":false}
With Indent: 2, the same data becomes:
{
"event": "order.shipped",
"id": "evt_81F3",
"created_at": "2024-06-10T14:02:11Z",
"order": {
"number": "A-1042",
"total": 149.5,
"currency": "EUR",
"items": [
{
"sku": "KB-01",
"qty": 1
},
{
"sku": "MS-02",
"qty": 2
}
],
"shipping": {
"method": "ground",
"tracking": "TRK-58310042"
}
},
"test": false
}
Every array element gets its own lines. JSON.stringify has no "keep short arrays inline" mode, so even [80, 443] spreads over four lines.
Choosing an indent
- 2 spaces is what npm writes to
package.json and what most JavaScript projects use. Deep nesting stays on screen.
- 4 spaces matches PHP's
JSON_PRETTY_PRINT and Python's common json.dumps(data, indent=4).
- Minify removes every space and line break outside strings. Use it when JSON must fit on one line: an environment variable, a log entry, or a
curl -d argument. Over HTTP the saving is smaller than it looks, because gzip already compresses whitespace well.
Tab indentation is not offered.
Sort Keys: stable output for diffs
With Sort Keys checked, the keys of every object are sorted alphabetically at every level. Array order is never changed. Sorting before you commit a generated config file means a different key order no longer shows up as a change. This manifest:
{"name":"api","scripts":{"test":"jest","build":"tsc"},"dependencies":{"zod":"^3.23.0","express":"^4.19.2"}}
formats with Sort Keys on as:
{
"dependencies": {
"express": "^4.19.2",
"zod": "^3.23.0"
},
"name": "api",
"scripts": {
"build": "tsc",
"test": "jest"
}
}
The sort compares characters by their code, so uppercase letters come before lowercase ones: "Zeta" sorts ahead of "alpha".
What changes besides whitespace
Re-serializing is not purely cosmetic. Expect these differences when you compare input and output:
- Number-like keys move to the front. In
{"b": 1, "10": "x", "2": "y"} the output order is "2", "10", "b", with or without Sort Keys. JavaScript objects always list integer-like keys first, in numeric order.
- Numbers are written in shortest form.
1.0 becomes 1, 1e3 becomes 1000, and -0 becomes 0. Very large integers are rounded, a problem explained on the JSON Validator page.
- Escapes are decoded.
"café" is written as "café" and "https:\/\/example.com" as "https://example.com". The data is identical, but a text diff will flag the line.
Limitations
- The parser is strict. Comments, trailing commas, or single quotes stop formatting with an error message. Fix those first with the JSON Repair tool.
- The input must be one JSON value. JSON Lines files (one object per line, common in logs and data exports) fail at the start of the second line. Format one line at a time.
- Import URL fetches the file directly from your browser, so the other server must allow cross-origin requests. If the import fails, download the file and use Import File instead.
When to use a different tool
- To find out exactly why a document is rejected, use the JSON Validator.
- To edit JSON by hand with highlighting and bracket matching, open the JSON Editor.
- To open an array of records in a spreadsheet, convert it with JSON to CSV.
Frequently asked questions
How do I pretty-print JSON?
Paste the JSON into the input editor, choose Indent: 2 or Indent: 4, and click Format or press Ctrl + Enter (Cmd + Enter on a Mac). The formatted result appears in the output editor, where you can copy it or download it as formatted.json.
What is the difference between formatting and minifying JSON?
Formatting adds line breaks and indentation so people can read the structure. Minifying removes every space and line break outside of strings so the data takes fewer bytes. Both contain exactly the same data. Choose Minify in the indent menu to get the compact form.
Why did the order of my keys change after formatting?
Keys that look like whole numbers, such as "2" or "10", are always placed first and in numeric order. This is how JavaScript objects store keys, and the formatter parses your JSON into a JavaScript object before writing it out again. Other keys keep their original order unless you turn on Sort Keys.
Can I keep short arrays on one line?
No. The formatter uses JSON.stringify, which puts every array element and every object property on its own line when an indent is set. If you need a compact style for short arrays, format the file with your code editor or a project formatter instead.
Does formatting change my data?
The values stay the same, but the text can differ in small ways: numbers are written in their shortest form (1.0 becomes 1), escape sequences such as é are written as the actual character, and integers larger than 9007199254740991 lose precision. If a byte-for-byte copy matters, keep the original.
Is my JSON uploaded anywhere?
No. Formatting runs in your browser with the built-in JSON.parse and JSON.stringify functions. Pasted text and imported files stay on your device. Import URL fetches the file directly from your browser.