How to View JSON as a Tree
Paste your JSON
Copy any JSON value - an object, an array, or a single string or number - into the input box. The text is parsed on your device with the browser native JSON parser, so the data you paste stays on your device and is not uploaded anywhere.
Click View Tree
The viewer parses the text and renders it as a color-coded tree. Keys, strings, numbers, booleans, and null each get their own color, and arrays and objects show their size as Array of n items and Object with n keys so you can gauge structure at a glance.
Expand and collapse nodes
Click the minus or plus toggle next to any array or object to collapse or reopen that branch. This lets you fold away large sections and drill into the nested data you care about. Use the Clear button to reset the input and viewer.
How Each JSON Type Is Shown
The viewer reads your parsed JSON and renders every value according to its type. The table below shows how each JSON data type appears in the tree so you know what to expect when exploring nested data.
| JSON type | Tree display | Interactive |
|---|---|---|
| Object | Shown as Object with n keys with a toggle, where n is the number of keys | Collapsible |
| Array | Shown as Array of n items with a toggle, where n is the item count; items are indexed | Collapsible |
| String | Quoted text in the string color; values over 200 characters are truncated with an ellipsis | No toggle |
| Number | Rendered in the number color as written | No toggle |
| Boolean | Shown as true or false in the boolean color | No toggle |
| Null | Shown as null in the null color | No toggle |
When This Tool Helps
Inspecting API responses
Paste a raw API payload to see its shape clearly. Object with n keys and Array of n items labels reveal counts and nesting without scrolling through minified text.
Navigating deep structures
Collapse branches you do not need and expand only the path to the field you want. Handy for large configuration files and nested response bodies.
Spotting malformed JSON
If the text cannot be parsed, the viewer shows an Invalid JSON message with the parser error so you can locate the problem before using the data elsewhere.
Working with sensitive data
Because parsing happens in your browser and nothing is uploaded, the input stays on your device. Still avoid pasting live secrets or tokens you would not want on screen.
Common Problems and Fixes
It says Invalid JSON
The text could not be parsed. Common causes are trailing commas, single quotes instead of double quotes, unquoted keys, or comments, none of which standard JSON allows. Read the error message for the position, fix the syntax, and click View Tree again.
A long string is cut off
String values longer than 200 characters are shortened with an ellipsis to keep the tree readable. The full value is still in your original text; copy it from your source if you need the complete content.
Nothing happens when I click View Tree
The viewer only renders when the input is not empty. Make sure you have pasted text into the box. If the input is blank, the tree area simply stays hidden.
The tree is too large to scan
Use the minus toggles to collapse top-level objects and arrays, then expand only the branch you need. This keeps very large or deeply nested documents manageable on screen.