JSON Tree Viewer

How do you inspect a JSON response and copy the right value?

Paste the following document into JSON Input. The root object shows three immediate children: order, items, and a.b. Open the first object inside items to inspect its sku and quantity fields. This example separates a large numeric identifier, an array position, and a key containing punctuation, so you can check both the displayed structure and the copied output.

{
  "order": {"id": 9007199254740993, "paid": true},
  "items": [{"sku": "P-42", "quantity": 2}],
  "a.b": "ready\nnext"
}

Search for quantity and click Next match. The viewer opens the ancestors of that field, even if you closed items earlier. The quantity row is a number with value 2; its Path button copies $.items[0].quantity. On order.id, JSON copies 9007199254740993 exactly. It does not round the identifier through a JavaScript numeric conversion.

Copy options for the a.b string in this example

Button	Copied result	Use
Path	$['a.b']	Identify the field location
JSON	"ready\nnext"	Keep a quoted JSON string token
Value	ready, then next on a new line	Get decoded plain text

Why use a tree instead of reading formatted JSON?

A tree makes parent-child relationships explicit without keeping every branch open. Objects show their immediate entry count and arrays show their item count, rather than a total of all descendants. Root and first-level containers initially expand; containers at depth two and below start collapsed. Closing a parent hides its descendants without removing their data from the parsed document.

This is useful when reviewing an API response before writing field access code, inspecting a JSON configuration, or checking database results for an unexpected array. The viewer does not fetch an API endpoint or execute a configuration file. Paste the JSON response body itself, leaving out HTTP headers, command output, and surrounding explanatory text. Use JSON Formatter when your next task is an indented text representation.

How are JSON types and empty values displayed?

The viewer labels the six JSON value types from RFC 8259: object, array, string, number, boolean, and null. Each row includes its type as text. A string containing digits remains a string; it is not converted to a number. Likewise, the quoted text "false" remains different from the boolean false. This distinction matters when debugging a response whose field names look correct but whose types do not match your application.

Empty objects and arrays show zero children. A null value is an actual row, while a missing property has no row. The root does not have to be an object: an array, string, number, boolean, or null is also accepted. Keys and scalar previews are limited to 200 characters before layout truncation; use the copy buttons to obtain the full content rather than treating a short preview as the complete value.

How does search find values inside collapsed branches?

Search keys and values performs a case-insensitive substring match against each row's own key and scalar value. Strings are searched as decoded text; numbers use their preserved token text. A container matches its own key, not a combined serialization of everything below it. The match count includes results inside collapsed branches, so a closed parent does not exclude its descendants from searching.

Next match and Previous match cycle through the results and expand the selected result's ancestors. Search highlights matching rows rather than removing other rows from the tree. The search field accepts up to 200 characters. It is a text search, not a regular expression engine, JSONPath evaluator, or type filter. Clear the search to remove highlights while continuing to inspect the document.

What does a copied JSONPath mean?

JSONPath, standardized in RFC 9535, describes locations in JSON. The root is $, ordinary object keys use dot notation, and arrays use zero-based bracket indexes. For example, $.users[0].email identifies the email field in the first users element. Keys containing punctuation use quoted bracket notation, and the path builder escapes embedded quotes and backslashes.

A generated path records a node location; the viewer does not run it as a query. Use a compatible JSONPath implementation when you need to evaluate the copied location elsewhere. Duplicate object names remain separate entries in this viewer and contribute separately to child counts, but share the same generated path. A copied path therefore cannot distinguish duplicate siblings by itself; inspect their rows and values before using that location downstream.

What stays lossless when you copy JSON?

Number tokens retain their original spelling, including decimal zeros and exponent notation. String tokens retain their JSON escapes. JSON copies an object's or array's reconstructed compact representation, preserving entry order and duplicate names while removing formatting whitespace between tokens. It does not preserve the source document's indentation. Value appears only for strings and returns the decoded characters, which may include actual tabs or newlines.

The viewer is for inspection and copying, not in-place editing of tree nodes. Change the source in JSON Input to change the document. For a separate compact text workflow, use JSON Minifier. If you plan to feed the copied result into another application, remember that application's parser may handle large numbers or duplicate names differently.

What happens with invalid or very large input?

Parsing starts after a 200 ms pause following an input change. Invalid syntax produces an error with a line and column. Comments, trailing commas, unquoted keys, and multiple consecutive root values are not accepted. The parser enforces a maximum of 512 nested containers. For a dedicated syntax-checking workflow, use JSON Validator; this viewer does not validate an application schema.

Input exceeding 1,048,576 characters or UTF-8 bytes moves parsing and tree construction to a local worker. Status distinguishes parsing from building the tree, with processed-node updates during construction and a Cancel button. After cancellation, edit the input to retry. Virtualized rendering limits mounted rows, but parsing still builds the whole document in memory. There is no guaranteed file-size capacity or constant-memory streaming mode.

How can you navigate the tree with a keyboard?

Focus a tree row and use Up or Down to move between visible rows. Right opens a closed container or moves into its first visible child; Left closes an open container or moves to its parent. Home and End jump to the first and last visible rows. The tree exposes row level, sibling position, selection, and expansion state to assistive technology. Node copy buttons remain available for keyboard use.