Explore JSON as a tree

Why use a tree view?

A foldable document makes deeply nested payloads easier to scan without turning values into separate form fields. Objects and arrays have gutter controls while the JSON itself remains ordinary editable text.

Find, Expand, and Collapse are always visible. Place the caret anywhere to edit keys, values, punctuation, or complete branches; use the editor's normal selection, deletion, paste, and undo behavior.

How to use this tool

1. Paste or type JSON in the continuous editor.
2. Place the caret anywhere and edit the JSON as normal text.
3. Use Find, gutter folds, Expand, Collapse, or native undo without changing views.

Example

{"user":{"name":"Ada","roles":["admin","editor"]}}

One editable JSON document with foldable user and roles structures.

Common problems

• Incomplete JSON stays untouched in the same editor so you can finish typing or open Repair.
• Only nearby lines are mounted for large files, so the browser does not create one DOM element per document line.
• A very large structure may collapse at its outermost branch before deeper fold ranges finish parsing.

Useful tips

• Use the always-visible Find field for a quick key or value lookup.
• Press Ctrl or Command + F to focus Find and Escape to return to the document.
• Use Minified when you need one-line JSON.
• No document data leaves your device.