DevToolsmith

JSON Viewer

Paste JSON or drop a file to explore it as a collapsible tree. Search keys and values, expand by level, and click any node to copy its path as JSONPath, JavaScript, Python or jq. Large numbers are shown exactly as written.

Runs 100% in your browser — nothing is uploaded

JSON
Tip: drop a file here388 chars · 388 bytes · 13 lines

17 keys · depth 4 · 1 number JSON.parse would change, shown exactly as written

  • {…}8 keys

Reading JSON paths

The same location written in the four path syntaxes the viewer copies:

SyntaxPath to the first endpoint’s methodsUse it in
JSONPath$.endpoints[0].methodsJSONPath libraries, Kubernetes kubectl -o jsonpath, API test tools
JavaScriptdata.endpoints[0].methodsBrowser and Node.js code
Pythondata["endpoints"][0]["methods"]Code using json.load
jq.endpoints[0].methodsThe jq command-line tool

Keys that aren’t plain identifiers need quoting: $['requests per minute'] in JSONPath, data.limits["requests per minute"] in JavaScript and .limits."requests per minute" in jq. To query many values at once with filters and wildcards, use the JSONPath tester.

Exploring JSON on the command line

Shell
# Pretty-print and page through a file
jq . data.json | less

# List the top-level keys
jq 'keys' data.json

# Print every path in the document, one per line
jq -c 'paths' data.json

# Get one value using the path copied from the viewer
jq '.endpoints[0].methods' data.json

# Python: pretty-print without installing anything
python3 -m json.tool data.json

Frequently asked questions

How do I get the path to a value in JSON?

Click the value in the tree. The panel next to it shows the path in four forms: JSONPath ($.endpoints[0].path), JavaScript (data.endpoints[0].path), Python (data["endpoints"][0]["path"]) and jq (.endpoints[0].path), each with a copy button. Keys with spaces or symbols are quoted correctly in every syntax.

Can it open large JSON files?

Yes. Drop a file on the input or use Upload; it is read locally and never uploaded. Only the first two levels are expanded at first, and long arrays show 200 items at a time with a button for more, so even files with hundreds of thousands of values stay responsive. Search finds matches anywhere and opens the tree down to them.

Why does the viewer show 9007199254740993 when other tools show …992?

JavaScript numbers are 64-bit floats and can only represent integers exactly up to 2^53 (9,007,199,254,740,991). Viewers built on JSON.parse silently round bigger values such as database IDs or Twitter/X IDs. This viewer keeps every number exactly as written in the file and tells you how many such numbers it found.

What happens with duplicate keys?

JSON technically allows an object to repeat a key, but parsers keep only one value, usually the last. The viewer shows every occurrence so you can see the data as written, warns that duplicates exist, and resolves paths to the last one, like JSON.parse and Python’s json module do.

Viewer, formatter or validator: which do I need?

Use the viewer to explore unfamiliar JSON and find paths. Use the JSON formatter to produce indented text you can save or paste back, and the JSON validator when the JSON doesn’t parse and you need the exact line and column of the error. All three keep big numbers exact.