Paste a massive JSON object, click any key or value in the tree, and get the exact path instantly — as JS dot notation, bracket notation, JSONPath, or jq.
| Format | Example | Typically Used In |
|---|---|---|
| Dot Notation | data.orders[0].customer.email | JavaScript, TypeScript |
| Bracket Notation | data['orders'][0]['customer']['email'] | JavaScript (dynamic / special-character keys) |
| JSONPath | $.orders[0].customer.email | Postman tests, JSONPath libraries, some no-code tools |
| jq | .orders[0].customer.email | jq CLI, shell scripts, CI pipelines |
The Visual JSON Path Extractor is a free online developer tool that helps you explore complex JSON structures and instantly generate the exact path to any key or value. Instead of manually counting nested objects or array indexes, simply paste your JSON, browse the interactive tree, and click any node to copy its complete path in multiple formats.
Whether you're working with REST APIs, GraphQL responses, configuration files, MongoDB documents, or large nested JSON payloads, this tool makes navigation simple and error-free. It supports JavaScript dot notation, bracket notation, JSONPath expressions, and jq syntax for maximum compatibility.
JSONPath is a query language used to locate and extract specific values from JSON documents. It works similarly to XPath for XML, allowing developers to navigate nested objects, arrays, and properties using concise path expressions such as $.users[0].name.
JSONPath is commonly used in REST APIs, Postman tests, automation frameworks, data transformation tools, and scripting languages to access deeply nested JSON values without manually traversing the entire document.
Input JSON
{
"user": {
"name": "John",
"orders": [
{
"id": 101,
"total": 299
}
]
}
}
Clicking the value 299 generates:
| Format | Generated Path |
|---|---|
| Dot | data.user.orders[0].total |
| Bracket | data['user']['orders'][0]['total'] |
| JSONPath | $.user.orders[0].total |
| jq | .user.orders[0].total |
| JSONPath | Dot Notation |
|---|---|
Starts with $ |
Starts with a variable name |
| Used in API tools | Used in JavaScript |
| Supports filters | Direct property access |
| Works in Postman | Works in browsers |
Large API responses often contain deeply nested objects and arrays that are difficult to navigate manually. This tool eliminates guesswork by allowing you to visually inspect the JSON hierarchy and instantly identify the correct path without counting indexes or typing complex expressions.
It is especially useful when creating API integrations, writing automation scripts, testing REST endpoints, configuring data mappings, or building applications that consume JSON data.
.keyName, so the tool automatically switches to bracket notation for those.data but you can set it to match whatever variable holds this JSON in your code, e.g. response or payload.$.users[0].name. It is commonly used in API testing, automation, Postman, and data processing tools.
data.user.name. It works well for keys that are valid JavaScript identifiers and do not contain spaces or special characters.
data["user-name"] or data["first name"]. It is required for keys containing spaces, hyphens, numbers, or other special characters.
$.orders[0].items[2].price.
data) to any value like response, payload, or result. The generated dot and bracket notation paths will automatically use your chosen variable name.