JSON Tree Viewer
Explore nested JSON as a colour-coded tree.
JSON Raw Input
Tree View
Paste JSON above to explore it here.
Why a tree beats raw text for nested data
Formatted JSON is readable until it is about four levels deep, at which point indentation alone stops carrying the structure and you start counting brackets to work out where you are. A tree view makes the nesting explicit and colours values by type, so an array of objects is recognisable at a glance rather than after a careful read.
Types are colour-coded consistently: strings, numbers, booleans, and null each get their own treatment. That matters more than it sounds — the single most common surprise when reading an API response is a number that arrived as a string, and in raw text the only clue is a pair of quotes that is easy to skim past.
The tree is generated from the parsed value, not the source text. Anything the parser normalises away — escaped Unicode, duplicate keys, insignificant zeros — is already resolved by the time it renders, so what you see is what your code will receive.
Frequently asked questions
How is this different from formatting?
Formatting re-prints the same text with indentation. The tree view renders the parsed structure as nested elements with values coloured by type, which stays legible at depths where indentation alone does not.
Does the viewer change my JSON?
No. It parses the input and renders it. Your source text is untouched, and the Copy Source button returns exactly what you pasted.
Can it handle large documents?
Yes, though very large arrays produce a correspondingly large tree and the browser will slow down. For multi-megabyte payloads, inspect a representative slice.
Why does a number appear as a string?
Because it is one in the source — it was quoted. The colour coding makes that visible, and it is a common cause of comparison bugs when consuming an API.
Is my JSON uploaded anywhere?
No. Parsing and rendering happen in your browser and nothing is transmitted.