What is a JSON formatter?
A JSON formatter takes JSON text, such as a minified API response or a hand-edited config file, and rewrites it with consistent line breaks and indentation so its structure is easy to read. This one also checks the syntax as it goes: if the input isn't valid JSON, you get the parser's error message instead of output.
JSON (JavaScript Object Notation) is the standard data format for web APIs and many configuration files. It's defined in RFC 8259 and ECMA-404. Servers usually send it minified, with every space and newline stripped to save bandwidth, which makes it hard to read when debugging.
How to format JSON
- Paste your JSON into the input box. It can be minified, unevenly indented, or copied from a log.
- Click Format.
- Copy the formatted result from the output panel.
For example, this minified response:
{"user":{"id":42,"name":"Ada Lovelace","roles":["admin","editor"],"active":true}}
becomes:
{
"user": {
"id": 42,
"name": "Ada Lovelace",
"roles": [
"admin",
"editor"
],
"active": true
}
}
Common JSON errors and how to fix them
Most invalid JSON comes from a handful of mistakes, usually from writing JSON by hand or copying a JavaScript object literal:
| Input | Error you'll see | Fix |
|---|---|---|
{"name": "Ada",} |
Expected double-quoted property name | Remove the trailing comma after the last item |
{name: "Ada"} |
Expected property name or '}' | Put keys in double quotes: "name" |
{"name": 'Ada'} |
Unexpected token ''' | Use double quotes for strings, never single quotes |
{"a": 1} // note |
Unexpected non-whitespace character after JSON | Remove comments; JSON doesn't allow them |
{"a": undefined} |
Unexpected token | Use null; undefined, NaN and Infinity aren't valid JSON |
The exact wording depends on your browser. Chrome and Edge include the line and column of the error, which is usually the fastest way to find it.
What changes when JSON is formatted
Formatting is meant to change only whitespace, but because the input is parsed and re-serialized, a few things can differ from what you pasted. These are worth knowing before you paste the result back into a file:
- Duplicate keys collapse to the last one.
{"id": 1, "id": 2}becomes{"id": 2}. - Very large integers lose precision. Anything above 9,007,199,254,740,991 (2^53 - 1) is rounded, so
12345678901234567890becomes12345678901234567000. Twitter's API, for example, returns tweet IDs as strings for exactly this reason. - Integer-like keys move to the front. In
{"b": 1, "2": "two", "1": "one"}, the keys"1"and"2"are printed first. Other keys keep their original order. - Numbers are normalized.
1.50becomes1.5and1e3becomes1000. The values are equal, but the text differs. - Unicode escapes are decoded.
"é"is printed as"é".
None of these change what the data means to a program that reads it, with the exception of large integers. If you need a byte-for-byte copy of the original structure, compare the two with the code diff tool.
Formatting vs. validating vs. minifying
- Formatting (this tool) adds indentation for people to read.
- Validating only answers "is this valid JSON?", without changing anything. It checks syntax, not whether the data matches a particular JSON Schema.
- Minifying does the reverse of formatting: it strips all optional whitespace to make the payload as small as possible.
If you want to edit JSON with syntax highlighting rather than just reformat it, use the online JSON editor, which also has a one-click Format button.
Last updated