71 chars · 4 lines
Two-way sync · Edit either side and the other updates automatically.
71 chars · 4 lines
Two-way sync · Edit either side and the other updates automatically.
JSON tree viewing guide
Paste valid JSON into the viewer above to turn nested objects and arrays into an interactive tree. Expand only the branches you need, search keys and string values, and inspect the document locally in your browser.
Tree view represents each JSON object and array as an expandable branch. Object properties use their keys as labels, while array items use numeric indexes so the original hierarchy remains visible.
The root branch opens automatically. Deeper branches remain collapsed until you expand them, which keeps complex API responses easier to scan than a fully expanded text document.
Use tree search to find matching property names or string values. Selecting a result expands its parent branches, reveals entries beyond the first rendered batch, and moves focus to the matching path.
Wide branches are rendered in bounded batches instead of creating every row at once. Excessively deep documents are rejected before recursive tree rendering can destabilize the page.
Parsing, searching, and tree rendering happen in the browser, so API responses and configuration data are not uploaded to a viewer service.
A nested JSON document becomes a hierarchy of expandable object properties and indexed array items.
{
"user": {
"name": "Ada",
"active": true
},
"roles": ["admin", "editor"]
}$ {2}
user {2}
name Ada
active true
roles [2]
0 admin
1 editorCommon questions
No. JSON parsing, tree rendering, searching, and file imports run locally in your browser.
Yes. Search matches object keys and string values, and selecting a result expands the path that contains it.
Only the root opens automatically so large documents remain readable. Expand any object or array branch when you need its children.
Yes. A branch initially renders up to 100 entries and provides a control to reveal additional entries in bounded batches.