100% PrivateNo ServerFree
Tree View
$:{1}
store:{3}
name:"My Store"string
book:[2]
location:{2}

How It Works

1

Paste JSON

Paste your JSON data into the left panel. The tool will parse and display it as a tree.

2

Click a Node

Click any node in the tree view to see its JSONPath expression.

3

Copy the Path

Copy the JSONPath expression to use in your code or API queries.

Frequently Asked Questions

What is JSONPath?
JSONPath is a query language for JSON, similar to XPath for XML. It uses dot notation ($.store.book[0].title) to navigate to specific values in a JSON document.
How do I use JSONPath?
JSONPath expressions start with $ (the root). Use dots for object properties ($.name), brackets for arrays ($.items[0]), and wildcards ($..price) for recursive searches.
Can I search within the JSON?
Yes, use the search box to find keys or values within the JSON tree. Matching nodes are highlighted for easy identification.
What JSON formats are supported?
Any valid JSON is supported, including objects, arrays, nested structures, and all JSON data types (strings, numbers, booleans, null).
Is my data sent to a server?
No, all JSON parsing and path finding happens entirely in your browser. Your data never leaves your device.
Share:

About JSON Path

What this tool does

Developer and design tools include CSS generators (gradients, shadows, glassmorphism), code playgrounds, color pickers, responsive previews, and reference charts for HTML tags, HTTP methods, and keyboard shortcuts.

Why use this tool

Front-end development involves constant context switching between code and visual output. Having generators and references in a single browser tab speeds up prototyping and reduces the need to search through documentation sites.

How it works

Each tool provides an interactive UI: you tweak parameters (colors, radii, durations), and the tool generates the corresponding CSS, HTML, or SVG code in real time. Copy the snippet directly into your project.

Pro tip

Use the CSS variable output option when available. It makes your generated code theme-friendly and easier to maintain across a design system.

Deep Dive: Related Research

The Complete JavaScript Reference Guide 2026: Every Feature, Method & API Explained

30,000 words · 65 min read

The Complete Guide to Web APIs: REST, GraphQL, gRPC & Beyond (2026)

27,000 words · 58 min read

Explore More

Love this tool? Explore 12467+ more

Free online tools for images, PDFs, text, code, and more. All running in your browser.

Explore All Tools