Visualize JSON data as a collapsible tree with syntax highlighting and search.
Enter the JSON data you want to explore as a tree.
Click arrows to expand or collapse nested objects and arrays.
Click a node to copy its JSON path for use in code.
This tool turns a JSON document into an expandable tree: paste the text or load a file, and every object, array, string, number, boolean, and null becomes a node you can collapse or expand, color-coded by type, with counts on every array and object. A search box finds matching keys and values and steps through the hits. The surprise for most users is strictness: the input must be valid JSON as defined by RFC 8259. Trailing commas, JavaScript-style comments, single-quoted strings, and unquoted keys are all rejected with a parse error. The tree is for reading structure, not reformatting - nothing is pretty-printed back out.
A concrete input and expected output from the current implementation.
Input
{"name":"Ada","roles":["math","code"],"meta":{"active":true,"score":41.5}} Expected output
{ } (3 keys)
name: "Ada" string
roles (2 items)
0: "math" string
1: "code" string
meta (2 keys)
active: true boolean
score: 41.5 number The tree mirrors the document's structure: the root object lists its three keys, arrays and objects show their size until expanded, and every scalar carries its JSON type. Each count and type shown follows directly from the input - two array items, two object keys, one boolean, one number.
Before anything renders, the pasted text is parsed as strict JSON. Anything outside the grammar - trailing commas, comments, single quotes, unquoted keys, NaN, Infinity - stops the parse with an error pointing at the offending position, and no tree is built. The tree is constructed from the parsed values, so the input's own formatting (indentation, line breaks, spacing) has no effect on the structure shown.
Each node collapses or expands independently, and global controls fold or flatten the entire document at once. Large arrays and objects render as collapsed entries showing their element or key count until opened, so a 10,000-item response is not expanded by default. Search scans keys and values, highlights every match, and shows a position counter so you can step through hits without manually expanding the path to each one.
No. Parsing, tree-building, highlighting, and search all happen inside your browser, and nothing is sent to a server. This makes the tool a safe place to inspect API responses that contain tokens or personal data. The same browser-only constraint is why very large documents can render slowly - the work is done on your machine.
JavaScript object literals are a superset of JSON: they allow single-quoted strings, trailing commas, comments, and unquoted keys, and JSON allows none of these. If your text came from a console log, a config file, or a code snippet rather than a strict JSON source, that is the likely cause. Remove the extras and the parse will succeed.
The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Convert between bytes, KB, MB, GB, and TB with precise binary and decimal calculations.
Open, view, and edit CSV files in a spreadsheet-style table with sorting and filtering.
Generate Code 128, EAN, UPC, and other barcode formats with customizable size and labels.
Convert images to Base64 data URLs and decode Base64 strings back to images.
Generate Apache .htaccess redirect rules for 301, 302, and rewrite configurations.
Create valid XML sitemaps with priority, change frequency, and last modified dates.