Developer

Free JSON Tree Viewer

Visualize JSON data as an interactive, searchable collapsible tree.

input.json✓ valid
objectarraystringnumberbooleannullscroll=zoom · drag=pan · click header=expand

About this tool

This tool renders your JSON as a visual connected node graph. Each object and array is a clickable card you can expand or collapse. Primitive key-value pairs are shown inline, while nested structures branch out as connected nodes. Supports drag & drop JSON files, search highlighting, pan & zoom, copy JSON path, and works fully in your browser with no server uploads.

How to use

Step 1: Paste JSON or drag & drop a .json file into the left editor.
Step 2: Click Visualize to render the interactive node graph.
Step 3: Click any object or array node to expand/collapse its children.
Step 4: Use Search to highlight matching keys or values across all visible nodes.
Step 5: Scroll wheel to zoom · Drag background to pan · Fit to auto-center.

Frequently Asked Questions

Nodes with 2+ complex children start collapsed. Use Expand All carefully on small trees. For very large JSON, explore branch by branch by clicking nodes.

Orange=object, blue=array, green=string, light blue=number, amber=boolean, gray=null.

Yes - hover a node and click the copy icon (⎘) in its header to copy the full dot-notation path like root.config.features.

No. All processing is done entirely in your browser.

Related Tools