JSON Formatter
Format, validate, minify and explore JSON in real time.
About JSON Formatter
The JSON Formatter takes minified or messy JSON and pretty-prints it with proper indentation, so you can actually read an API response or config file. Everything runs in your browser (nothing is uploaded), so it's safe to paste API keys, tokens, or internal payloads while you debug.
How to use it
- Paste or type JSON into the input pane on the left.
- Click Format to pretty-print it, or Minify to collapse it to a single line.
- Use Sort Keys or Remove Nulls from the toolbar if you need a cleaner diff or payload.
- Switch between the Formatted, Tree, and Diff tabs to explore the structure or compare changes.
- Export the result as JSON, TypeScript, or another format, or copy/download it directly.
Common use cases
- Reading a minified API response during debugging
- Cleaning up a config file before committing it
- Generating a TypeScript interface from a sample payload
- Spotting exactly what changed between two JSON responses using the Diff tab
Example
Before
{"name":"Ada","langs":["js","ts"],"active":true}After
{
"name": "Ada",
"langs": [
"js",
"ts"
],
"active": true
}Format turns the minified version on the left into the indented version on the right; Minify reverses it.
Common errors
Trailing comma, e.g. {"a": 1,}
Remove the comma before the closing brace or bracket — JSON doesn't allow a trailing comma.
Single quotes around strings or keys, e.g. {'a': 1}
Use double quotes only: {"a": 1}. JSON doesn't accept single quotes.
Unquoted keys, e.g. {a: 1}
Quote every key: {"a": 1}. Unquoted keys are JavaScript shorthand, not valid JSON.
"Unexpected end of JSON input"
The input is truncated — check for a missing closing brace/bracket, or a response that got cut off mid-stream.
FAQ
Is my JSON uploaded to a server?
No. Parsing, formatting, the tree view, and exports all run client-side in your browser: the JSON never leaves your machine.
Why does it show a line and column number for errors?
Invalid JSON is parsed and the exact position of the syntax error is reported, so you can jump straight to the problem instead of scanning the whole payload.
Can I convert JSON to a TypeScript interface?
Yes. Use the Export menu in the toolbar to generate a TypeScript type from your current JSON, alongside other export formats.
Is this the same as a JSON beautifier or JSON viewer?
Yes — Format acts as a JSON beautifier (pretty-printing with proper indentation), and the Tree tab acts as a JSON viewer for exploring nested structures visually instead of reading raw text.