JSON Tree Viewer

How to use it

1. Paste JSON into the input panel. Anything valid works: an object, an array, or a single scalar value.
2. The tree builds itself. Objects show their key count as {3}, arrays show their length as [12], and leaves show the value plus its type.
3. Click the small triangle next to an object or array to fold or unfold it. Use Expand all or Collapse all for the whole tree.
4. Type in Find path or key to highlight matching nodes. Matching rows get a colored outline, and their ancestors unfold automatically so you can see where the hit sits.
5. Click any row to copy that node's value to your clipboard. The confirmation toast shows the exact path you copied.

Paths follow dot and bracket notation: object keys that are plain identifiers use a dot, everything else uses brackets, and array indexes always use brackets. A value nested three levels deep reads as $.data.items[2].id.

Common use cases

• Reading an unfamiliar API response - collapse the branches you do not care about and walk the rest level by level.
• Finding one field in a large payload - search for the key name instead of scrolling, then copy the value straight from the highlighted row.
• Checking shapes before writing types - key counts and leaf types tell you whether a field is an object, an array or a scalar at a glance.
• Sanity-checking configuration files - spot a value that came back as a string when you expected a number, or a key that is spelled differently than you thought.

Why it stays private

Parsing and rendering happen entirely in your browser's memory. Your JSON is never uploaded, so API responses with tokens, customer records or internal configuration never leave your device.

FAQ

Q: How large can the input be? A: The tool renders what your browser can hold in memory. Very large documents are parsed but the tree shows a node count and depth instead of pretending every branch is equally useful; collapse branches you do not need.

Q: Why does a key show up as ["my key"] instead of .my key? A: Bracket notation is used whenever a key is not a plain identifier, for example when it contains a space, a dash or starts with a digit. Both forms point at the same value.

Q: Does clicking a row overwrite my clipboard with the whole document? A: No. A click copies only the value of the row you clicked, formatted as JSON. The toast tells you which path was copied so you can confirm before pasting.