How to view JSON as a tree
- Paste JSON, drop a file or load it from a URL. The tree appears next to the text.
- Click a row to expand or collapse it, or use Expand all and Collapse all. With the keyboard, ↑ and ↓ move and ← and → close and open nodes.
- Type in the search box to show only matching keys and values. Select a node to copy its JSONPath, its JavaScript path or its value.
Reading the JSON tree
- Objects show their number of keys, for example
{5}, and arrays their number of items, for example[12]. - Colors and small badges show the type of every value: string, number, boolean, null, object or array.
- Long arrays are shown 200 items at a time, so files with hundreds of thousands of values stay responsive.
- Numbers are displayed exactly as written – long IDs are not rounded, and keys keep their original order.
What is JSONPath?
JSONPath describes where a value sits inside a JSON document, much like a file path. It was standardised in 2024 as RFC 9535. $ is the root, .name selects a property, [0] an array item and ['first name'] a property whose name contains spaces or special characters.
| Path | Selects |
|---|---|
$.store | the store property of the root object |
$.products[0] | the first item of the products array |
$.products[0].price | the price of that first product |
$.address.geo.lat | a value nested three levels deep |
$['shipping address'].city | a key with a space in its name |
In JavaScript the same value is data.products[0].price – use Copy JS path to get that form.
Frequently asked questions
Can I open large JSON files?
Yes. Only the expanded parts of the tree are drawn and long arrays appear 200 items at a time, so files of tens of megabytes open in a desktop browser.
How do I copy the path of a value?
Click the node, then use Copy path for JSONPath ($.users[0].email) or Copy JS path for JavaScript (data.users[0].email).
Can I edit the JSON in the viewer?
The viewer is read-only, so nothing changes by accident. To change values, rename keys or add items, open the JSON Editor.
What happens if my JSON is invalid?
The error box shows the line, column and cause of the problem, and the tree keeps showing the last valid version until the error is fixed.