TinySandyFree Online Tools

JSON Tree Viewer

Paste a JSON document and browse it as a tree instead of scrolling through braces. Objects and arrays open and close with a click or the arrow keys, each node shows its type and size, and selecting a node gives you its exact JSONPath and JSON Pointer to copy into code or a query.

Format & Validate Runs in your browser

Explore Your JSON as a Tree

How to Use the JSON Tree Viewer

  1. Paste your JSON (a sample is already filled in) and choose how many levels to open.
  2. Press Show Tree. Invalid JSON is reported with the line and column.
  3. Click a row, or Tab into the tree and use Up/Down to move, Right/Left to open and close, Home/End to jump.
  4. Read the selected node's path and press Copy path. Use Expand all or Collapse all for the whole tree.

About This Tool

Developers reading large API responses, QA engineers locating a field in a payload, and anyone who needs the path to a deeply nested value.

Input: JSON  ·  Output: Interactive tree + JSONPath.

Features and Limitations

Features

  • Real ARIA tree: one Tab stop, arrow-key navigation and announced expanded/collapsed state.
  • Children are built only when you open a node, so documents with thousands of nodes stay responsive.
  • Key order and number digits are shown exactly as written, including very large integers.
  • JSONPath (for example $.store.book[0].title) and JSON Pointer for any node.

Limitations

  • “Expand all” stops after about 5,000 nodes to keep the page responsive; open deeper branches by hand.
  • Only strict JSON is accepted; comments, trailing commas and single quotes are reported as errors.
  • The viewer is read-only: it does not edit values.
  • Results are computed in your browser; nothing you enter is sent to a server.

Example

In the sample, selecting the title of the third book shows $.store.book[2].title and the pointer /store/book/2/title.

Frequently Asked Questions

How do I find the path to a value?

Select the node in the tree. The path box underneath shows its JSONPath and JSON Pointer, and the Copy path button copies the JSONPath.

Can I use it without a mouse?

Yes. Tab moves focus into the tree, the arrow keys move and open or close nodes, Enter or Space toggles a node and Home/End jump to the first or last visible row.

Why does a key show in quotes in the path?

Keys that are not simple identifiers, such as "first name" or "2024", are written in bracket notation like $['first name'] so the path stays valid.

Is my JSON uploaded?

No. It is parsed by JavaScript in your browser and never sent anywhere.

Related Tools

More like this: all Format & Validate tools, all Developer & Web tools or the TinySandy home page.