JSON Tree Viewer

View and explore JSON as an interactive, collapsible tree.

input.json

Formatting check: Invalid JSON syntax is automatically marked with error markers in the gutter.

Quick hotkey: Press Ctrl + Enter to compile tree representation instantly.

About the JSON Tree Viewer

Explore a JSON document as a collapsible tree instead of scrolling through raw text - especially useful for large, deeply-nested data.

🛠️
How to use it
  1. Paste your JSON into the editor.
  2. Click View Tree to render it as a collapsible tree.
  3. Click any node to expand or collapse it and explore nested structures.
  4. Click Download to save the JSON to a file.
💡
Tips & use cases
  • Collapse the top-level nodes first to get an overview, then drill into just the part you need.
  • Great for exploring a large API response without scrolling through thousands of lines of raw text.

View JSON as a Tree

This JSON tree viewer turns raw JSON into a collapsible outline, so you can see the structure of a document at a glance and drill into only the part you need - no more scrolling through thousands of lines of brackets.

🌳

Reading the tree

  • Objects show their number of keys, e.g. {4}; arrays show their number of items, e.g. [3].
  • Click the arrow next to any object or array to collapse or expand it.
  • Array items are labelled by index - 0, 1, 2 - so you can build a JSONPath like $.users[1].roles.
  • Values are coloured by type, so strings, numbers, booleans and null are easy to tell apart.
📋

When a JSON tree view helps

  • Exploring a large or unfamiliar API response
  • Understanding deeply nested config files
  • Finding the path to a value before writing a JSONPath or JMESPath query
  • Checking the shape of data before converting it to CSV or YAML

JSON tree viewer FAQ

What's the difference between a JSON tree viewer and a JSON formatter?

A formatter re-indents the JSON text; a tree viewer shows the structure as collapsible nodes with item counts. The tree is better for exploring, the formatter for editing and copying.

Can I view JSON as a table instead?

Yes - for arrays of objects, the JSON Grid Viewer shows each item as a row in a sortable table.

Is my JSON uploaded to a server?

No. The tree is built entirely in your browser.

🔗