# JSON Diff

> Compare two JSON values semantically. Ignores key order, highlights added/removed/changed paths, and works with nested objects and arrays.

URL: https://uttir.com/json-diff
Categories: developer-tools, data-tools, text-tools
Privacy: Both JSON values are parsed and compared in your browser. Nothing is uploaded — the diff never leaves your device.

## About

A line-based diff treats JSON as text. It shows every line that changed, but it cannot tell you that a single key was renamed, that key order shifted, or that one array element was added.

A semantic JSON diff compares the parsed structure. It walks both values, finds the added / removed / changed paths, and shows them in a table. Key order in objects is ignored by default (toggle off if order matters in your case).

## How to use

1. **Paste the two JSON values** — Drop the "before" JSON in the left panel, the "after" in the right. Both can be objects, arrays, or any JSON value — they do not have to be the same type.
2. **Read the table** — Each row is a path (e.g. users[3].email). Green rows are added, red rows removed, amber rows changed. Toggle "Show unchanged" to see what stayed the same.
3. **Copy the patch** — The "Copy patch" button puts a one-line-per-op summary in your clipboard — useful for sharing in chat or in a commit message.

## Examples

### Detecting a renamed key indirectly

Two objects that differ in one nested value.

Input:

```
Before: {"user":{"name":"Ada","age":30}}
After:  {"user":{"name":"Ada","age":31}}
```

Output:

```
1 changed: user.age 30 → 31
```

### Array element added

An element was added to the end of a tags array.

Input:

```
Before: ["eng","lead"]
After:  ["eng","lead","reviewer"]
```

Output:

```
1 added: [2] "reviewer"
```

## FAQ

### Does it ignore key order?

Yes, by default. {"a":1,"b":2} and {"b":2,"a":1} are treated as identical. Toggle "Ignore key order" off to detect reorder as a change.

### Does it work on arrays?

Yes. Arrays are compared by index, with added and removed elements reported as such. Note that this is positional — a different sort order is reported as a change to every element.

### How deep does it go?

As deep as the JSON. The viewer handles arbitrarily nested structures; the path notation uses dot for object keys and [N] for array indices.

### Is the data uploaded?

No. Both values are parsed in your browser and the diff is generated locally. The patch you copy is plain text, not a server call.

## Related tools

- [JSON Formatter](https://uttir.com/json-formatter) — Format, beautify, and validate JSON with adjustable indentation — instantly in your browser.
- [JSON Validator](https://uttir.com/json-validator) — Check whether your JSON is valid and find the exact line and column of any syntax error.
- [Text Diff](https://uttir.com/text-diff) — Compare two texts line by line and see exactly what was added, removed, or kept.
- [JSON Tree Viewer](https://uttir.com/json-tree-viewer) — Paste any JSON and explore it as a collapsible tree. Click any value to copy it, or copy the whole path. Free, runs in your browser, no upload.
- [API Tester (HTTP Requests)](https://uttir.com/api-tester) — Make HTTP requests from your browser: GET, POST, PUT, DELETE, with custom headers and body. Import a cURL command, see the full response (status, headers, body) with timing. Free, in browser, no signup.

---

For the full HTML page with the live tool, visit https://uttir.com/json-diff.
This file is the markdown rendering at https://uttir.com/json-diff.md. See https://uttir.com/llms.txt for a site-wide summary.