Skip to the JSON editor
JSON Formatter Viewer
FormatterViewerValidatorMinifierBeautifierPretty Print
JSON to CSVCSV to JSONJSON to YAMLYAML to JSONJSON to XMLXML to JSONJSON diff
FAQPrivacy

JSON viewer

input.json

Paste your JSON here

or drop a .json file anywhere here

Formatted output appears here.

Waiting for input

Reading an unfamiliar payload

The reason a tree beats formatted text is shape. Indented text tells you what the document contains; a tree tells you how it is organised, which is the question you actually have when a response arrives from an API you did not write.

A workable order of operations for something you have never seen before:

  1. Paste it. The root opens automatically, along with any small child objects, so the top-level shape is visible without a click.
  2. Read the status bar. Depth tells you how deep the nesting goes;keys shows total against unique, and a large gap between the two means you are looking at repeated records rather than a wide configuration object.
  3. If the root is an array of objects, switch to Table. Records are far easier to compare in rows than as sibling subtrees.
  4. Search for the field you care about, then use copy-path on the row to get the accessor for your code.

What each row tells you

  • Collapsed containers carry a count — 3 items or 5 keys — so you can judge whether a branch is worth opening before you open it.
  • Values are coloured by type, and strings keep their quotes. A number rendered as"42" is a string, and that distinction is usually the bug you are hunting.
  • null is shown explicitly rather than as an empty cell, because a null and a missing key are different things.
  • Every row has copy-value and copy-path buttons. Copy-value gives raw text for strings and formatted JSON for containers.

Why large documents stay responsive

The viewer builds DOM lazily. A collapsed node holds no child elements at all, and opening one renders only its immediate children — 200 at a time for large arrays. A 20 MB document therefore costs one parse plus a handful of rows on first paint, rather than millions of nodes the browser has to lay out before it will respond to input.

Expand is the one operation that can be genuinely expensive, so it stops after 20,000 nodes and tells you it did. For a whole-document read, the formatted text view is the better tool.

Reading JSON that arrived inside a string

Log pipelines and message queues routinely deliver JSON encoded as a JSON string, which arrives looking like "{\"id\":7,\"ok\":true}". Paste it and pressUnescape: the outer string is parsed, the inner document is decoded, and the tree renders the real structure. It works repeatedly for payloads that were encoded more than once.

Common questions

Does search find matches inside collapsed nodes?

Yes. Search walks the parsed data structure rather than the rendered DOM, so a match twelve levels deep inside a closed branch is still found — the tree then opens every ancestor to reveal it. Viewers that search the DOM silently miss those.

What does the copy-path button give me?

A JSONPath expression that resolves to that node, such as $.endpoints[1].p99_ms. It is valid input for jq (drop the $), for most JSONPath libraries, and it maps directly onto property access in code.

Why does a long array show only part of itself?

Arrays render 200 children at a time, with a button to load the next batch. Building 100,000 rows of DOM up front is what makes other viewers freeze; this way the first paint is immediate and you pull in more only where you are actually looking.

Can I navigate the tree with the keyboard?

Yes — the tree implements the ARIA tree pattern. Arrow up and down move between visible rows, right expands, left collapses or jumps to the parent, and Enter toggles. Ctrl/⌘ + K focuses the search box.

The rest of the toolkit

Same engine, same privacy — every page runs entirely in your browser.