JSON Tree Viewer

about this tool

Navigating a large document

Some JSON is too big to read as text. Paste it here and it becomes a collapsible tree: expand only the branch you care about, see each node's type, and read a summary of how many keys or items sit underneath before deciding to open it.

The statistics at the top — total nodes, maximum depth, counts by type — are often enough on their own to answer whether a response is shaped the way you expected.

To reformat or validate rather than browse, the JSON formatter does that; to repair near-JSON with unquoted keys or trailing commas, the JSON escape tool has a JavaScript-to-JSON mode.

Finding a value

Search scans keys and values and lists every match with its full path, which beats expanding branches at random when you know a customer ID is in there somewhere.

Path query goes the other way, evaluating an expression such as users[0].email or items[*].id against the document and returning what it finds. That is how you confirm the exact accessor to use in code before writing it, rather than discovering at runtime that the field was nested one level deeper than you thought.

Copying a path

Every node's path can be copied in the notation you need. This is the small thing that saves the most time: given a value forty lines into a nested response, getting data.attributes.billing.address[1].postcode right by hand is error-prone, and getting it wrong costs a test cycle.

What it does with awkward JSON

Numbers beyond JavaScript's safe integer range are shown as they were written, so a 64-bit ID from a database is not silently rounded in the display — a real hazard, since JSON.parse will happily turn 9007199254740993 into 9007199254740992.

Duplicate keys in the same object are resolved the way every JSON parser does, by keeping the last one, so if a value seems to have vanished, check for a repeated key above it.

Reading it safely

The document is parsed and rendered in the page and is never uploaded, so a tree view of a production payload or an export containing personal data is fine to open here.

For a query language rather than a viewer, the JSONPath tester runs an expression against the document and shows every match with the path that reached it.

questions

How do I find a value inside a huge JSON document?

Use search, which scans keys and values and lists every match with its full path. If you already know the shape, a path query such as items[*].id evaluates the expression against the document and returns what it finds.

Can I copy the path to a nested value?

Yes, every node's path can be copied. That is the main time-saver here: typing data.attributes.billing.address[1].postcode by hand is error-prone, and getting it wrong costs a test cycle.

Will it round large numbers in my document?

Values beyond JavaScript's safe integer range are displayed as they were written, so a 64-bit database ID is not silently altered in the view. This is a real hazard elsewhere, since JSON.parse turns 9007199254740993 into 9007199254740992.

Why has one of my duplicate keys disappeared?

Because every JSON parser keeps the last occurrence of a repeated key in the same object. If a value seems to be missing, look for the same key appearing again further down.

Is my JSON uploaded to view it?

No. Parsing and rendering happen in the page, so viewing a production payload or an export containing personal data is fine.