JSON Formatter & Viewer
Paste JSON and it is beautified in place. Click any field to inspect its full value and path on the right; syntax errors are located by line and column. Everything runs locally in your browser.
- Indentation
- 2 / 4 spaces · tab
- Extras
- Inspect · sort · stats
- Privacy
- Nothing uploaded
- Usage
- Free · no sign-up
WHY IT MATTERS
Built for anyone who reads JSON daily
API responses, config files, log payloads — raw JSON arrives as one dense line. Make it readable, find the broken comma, then put it back the way you need it.
Beautify & minify
One click switches between a human-readable tree and a compact single line. Pick 2 spaces, 4 spaces or a tab to match the style of your codebase.
Errors located by line and column
Invalid JSON reports the exact position — L12 : C34 — instead of a cryptic parser message, so you jump straight to the missing comma or trailing quote.
Recursive key sorting
Sort object keys alphabetically at every depth while arrays keep their order. Ideal for diffing configs and stabilizing fixtures across commits.
Escape / unescape literals
Turn JSON into an escaped string literal for embedding in code or env files, and unwrap a quoted literal back into raw JSON for inspection.
Click any field to see it in full
Click a field in the editor and a side panel opens with its complete value, type and JSON path — nested objects and arrays included, so you never count brackets by eye again.
Runs fully local
JSON never leaves your browser, the tool works offline, and no request is made while the input is empty.
How it works
Switch indentation between 2 spaces, 4 spaces and tabs. Minify onto a single line when sending to a machine, sort object keys recursively when you need a stable order, or escape the whole payload into a string literal — and unescape a quoted literal copied from a log line.
Click any field to inspect its full value in a side panel, and keys, array items and nesting depth update as you type. Keep several documents open on one page and compare them at a glance; each has its own editor. Everything runs locally in your browser and nothing is uploaded.
More JSON tools
Third-party tools picked by purpose — we don't duplicate them here, so head over when you need one.
| Tool | Purpose | What it does |
|---|---|---|
| JSON Editor Online | Edit & validate | Linked text and tree panes, drag-and-drop restructuring, plus diff, schema validation and querying. |
| JSON Crack | Visualize | Turns JSON into an interactive node graph for understanding deep nesting or building a quick demo. |
| JSON Visio | Visualize | Another graph viewer with a lighter UI — pick whichever of the two feels more natural. |
| Diffchecker | Compare | Compare two texts side by side or in a unified view and jump straight to inserted, deleted or changed lines. |
| JSONPath | Query | Run JSONPath expressions online and extract exactly the fields you need by path. |
| JSONata | Query & transform | A query and transformation language for JSON, with an online playground and examples. |
| quicktype | Type generation | Generate TypeScript, Swift, Go and other type definitions from JSON. |
| JSON Generator | Mock data | Generate structured mock data from templates — handy for API test fixtures. |
The fine print of JSON formatting
JSON looks simple but has a handful of strict rules — knowing them saves a round-trip every time a parser rejects your payload.
What counts as valid JSON?
JSON defines six value types: object, array, string, number, boolean and null. Keys must be double-quoted strings, there is no trailing comma, and comments are not allowed.
JavaScript extras such as single quotes, undefined, NaN, Infinity and trailing commas all fail a strict parser — which is exactly what this tool flags.
How is viewing different from formatting?
Formatting changes the text layout: indentation, line breaks and minification. Viewing leaves the document untouched — when you click a field, its complete value, type and JSON path appear in a side panel.
Deeply nested objects are hard to read from brackets alone, so clicking a field lets you confirm exactly what it contains — especially handy with API responses and log payloads.
Why does my key order change after formatting?
The JSON spec treats objects as unordered key–value pairs, and parsers are free to reorder them. In practice V8 (Chrome / Node) keeps insertion order for string keys, but integer-like keys ("1", "42") always sort numerically first.
Enable "Sort object keys" if you want a stable, alphabetical order that survives any parser — useful for diffing configs.
How big a number can JSON hold?
JSON itself places no limit, but JavaScript parses every number as an IEEE-754 double. Integers beyond ±2^53 (about 9 quadrillion) lose precision — 9007199254740993 becomes 9007199254740992.
If your payload carries 64-bit IDs or timestamps in nanoseconds, keep them as strings; this tool will not corrupt them, but anything you paste into JS code will.
When should I minify instead of beautify?
Beautify for anything a human reads: code review, debugging, documentation. Minify for anything a machine transfers: API bodies, URL parameters, env variables and .env files.
Minifying a typical API payload saves 15–30% of bytes with zero structural change — it is the cheapest compression there is.
What is escaping used for?
Escaping wraps JSON as a string literal: quotes become \" and newlines become \n, so it can sit inside another JSON value, a shell command, or an environment variable without breaking.
Unescape reverses it. If you have ever copied a payload out of a log line that looked like {\"a\":1}, that is the format — paste it here and hit Unescape.
Frequently asked questions
Is my JSON uploaded or stored anywhere?
No. Everything runs in your browser with JavaScript — no request ever carries your JSON anywhere, it works offline, and nothing is written to local storage, so refreshing the page clears the input.
Why does formatting fail on my config file?
Most likely it is not strict JSON: JSONC / JSON5 allow comments and trailing commas, YAML is indentation-based, and .env files are key=value pairs. Strip comments and trailing commas first, or use a parser made for that format.
Does sorting keys change arrays too?
No. Array order is meaningful (first item, second item…), so arrays are always left in place. Only the keys of objects — including objects nested inside arrays — are sorted alphabetically.
What does "Error near L12 : C34" mean?
It is the 1-based line and column where the parser gave up: line 12, column 34. The actual mistake is usually at or just before that spot — a missing comma on the previous line, an unescaped quote, or a trailing comma before a closing brace.
Is there a size limit? Does it work on mobile?
There is no hard limit — formatting a few megabytes of log output works. On low-end devices, very large inputs (tens of MB) may feel laggy because every keystroke re-parses and re-formats. The layout is responsive; the editor adapts to the screen width.