About the JSON Viewer
Large API responses are hard to read as text. The tree view shows each object with its key count {n} and each array with its length [n], so you can see the shape of a payload at a glance. Types are colour-coded: keys, strings, numbers, booleans and null each have their own colour. The first two levels open automatically; deeper branches load when you expand them, which keeps documents with tens of thousands of nodes responsive.
Click any key to copy its path. Paths use JSONPath-style notation that also works as JavaScript: $.users[0].address.city. Keys that are not valid identifiers are bracket-quoted, for example $.headers["content-type"]. Drop the leading $ to use the path in code (data.users[0]), or use it as-is in tools that accept JSONPath, such as jq-like query tools, Postman tests or Kubernetes kubectl -o jsonpath.
The filter matches key names and primitive values (case-insensitive) and shows only matching nodes and their ancestors, with matches highlighted. Parsing uses a strict parser, so invalid JSON is reported with its line and column. The data stays in your browser.
How to use it
- Paste JSON or open a .json file.
- Expand nodes, or use Expand all / Collapse all.
- Type in the filter box to show only matching keys and values.
- Click a key to copy its path; the path also appears above the tree.
Frequently asked questions
What path format is copied?
$, with array indexes in brackets and unusual keys quoted, e.g. $.items[2]["unit-price"]. It doubles as a JavaScript property accessor once you replace $ with your variable name.