JSON KitJSON Diff

JSON Diff

Paste two JSON objects and instantly see every addition, removal, and change — semantically, not textually.

JSON A (original)
Loading editor…
JSON B (modified)
Loading editor…

Related Tools

What is a Semantic JSON Diff?

A semantic diff compares JSON by meaning, not by text. It understands that {"a":1,"b":2} and {"b":2,"a":1} are identical — something a plain text diff gets wrong. JSON Kit parses both inputs and compares the resulting JavaScript objects using microdiff, then reports every addition, removal, and changed value with its exact path in the structure.

This is especially useful for comparing API response versions, tracking config drift, reviewing LLM output changes, or understanding what a function transformation did to a JSON payload.

How to Use This Tool

  1. Paste the original JSON into the left panel (A).
  2. Paste the modified JSON into the right panel (B).
  3. The diff updates automatically — scroll through the results below.
  4. Each row shows the path, the operation (added / removed / changed), and the before/after values.
  5. Copy the diff as plain text with the Copy button.

Reading the Diff Output

+ user.roles[1]: "editor"       ← added to array at index 1
~ user.name: "Alice" → "Alice Chen"  ← value changed
- version: 1                    ← key removed entirely
+ score: 99                     ← new top-level key added

Frequently Asked Questions

What makes this a 'semantic' JSON diff?
A semantic diff compares JSON by meaning, not text. Two JSON objects are identical if they have the same keys and values regardless of key order or whitespace — { "a": 1, "b": 2 } is the same as { "b": 2, "a": 1 }. A text diff would flag these as different because the characters differ. JSON Kit uses microdiff to compare parsed JavaScript objects, so key ordering is irrelevant.
What do the path expressions mean?
Paths show exactly where in the JSON structure a change occurred. user.name means the 'name' field inside the 'user' object. user.roles[1] means the second element (index 1) of the 'roles' array inside 'user'. This is the same notation used by JSONPath and JavaScript property access.
How does it handle added or removed array elements?
Each added or removed array element is a separate diff entry with its numeric index in the path. For example, adding 'editor' to a roles array at position 1 appears as: + user.roles[1]: "editor". This gives you precise tracking of what changed where, rather than just showing the whole array changed.
Can I compare two API response versions?
Yes — this is one of the most common use cases. Copy the response from two different API calls (or two versions of the same endpoint) into the A and B panels. The diff will immediately show you what fields changed between versions, which is invaluable when debugging API changes or tracking schema drift.
What if my JSON is out of order but semantically the same?
Key order doesn't matter — { "x": 1, "y": 2 } and { "y": 2, "x": 1 } produce zero diff entries. Array order does matter, because arrays are ordered by definition. If you have { "tags": ["a", "b"] } and { "tags": ["b", "a"] }, the tool will report two CHANGE entries at indexes [0] and [1].
How do I copy the diff results?
The Copy button in the output panel header copies the diff as a plain-text summary with + / - / ~ prefixes, one line per change. This format is easy to paste into a Slack message, PR comment, or issue description.
What is the maximum JSON size this handles?
microdiff is efficient for typical API response sizes. For very deep or wide objects (thousands of keys), diffing may take a fraction of a second. JSON Kit handles files up to ~50MB in the editor panels. For extremely large payloads, consider using jq on the command line: diff <(jq -S . a.json) <(jq -S . b.json) (the -S flag sorts keys).

About This Tool

JSON Diff is powered by microdiff — a tiny, zero-dependency deep diff library that operates on parsed objects rather than strings. Key order is irrelevant; array order is respected (since arrays are ordered by definition). The diff runs in your browser on every keystroke with a 250ms debounce. Results are shown as a scannable list with color-coded rows rather than the noise of a character-level text diff. The Copy button exports the diff in a simple+/-/~ text format suitable for pasting into PRs or Slack.