DevToolsBox
All tools

JSON Diff

Compare two JSON documents structurally and see exactly what changed.

1 line
1 line

About this tool

A text diff on JSON is noisy: reordering two keys or reindenting a file lights up as dozens of changed lines even though the data is identical. This tool parses both sides first and compares the resulting structures, so it reports what actually differs.

The result shows both documents side by side, aligned line for line, so every change is visible in the context that surrounds it. Long stretches with no changes are collapsed behind an expand control, which keeps a one-line change in a large configuration file from being buried.

How to use it

  1. Paste the original document on the left and the changed one on the right.
  2. Press Compare.
  3. Read the changed pane: green with a plus is a key that was added, yellow with a tilde is a key whose value changed.
  4. Red with a minus appears on the original, marking a key that was removed.
  5. Expand a collapsed run if you want to see the unchanged lines around a change.

Example

Original
{
  "age": 34,
  "name": "Islam"
}
Changed
{
  "age": 35,
  "admin": true,
  "name": "Islam"
}

FAQ

How is this different from a text diff?
A text diff compares characters and lines, so formatting and key order produce false differences. This tool compares parsed structures, so only real data changes are reported.
Is my JSON uploaded?
No. Both documents are parsed and compared in your browser. Nothing is sent to a server, and this page has no analytics.
How are arrays compared?
By position. Element 0 is compared with element 0, and so on. Inserting an item at the start therefore shows every later element as changed — accurate, but worth knowing before you read the output.
Does key order matter?
No. Objects are compared by key, so reordering keys produces no differences.
Why is the removed key marked on the original instead of the changed side?
Because a removed key has no line in the changed document at all — the only place its text still exists is the original. Everything else is reported on the changed side, so the original stays clean apart from those removals.
Is my key order preserved?
Yes. Each document is rendered in its own key order, and keys that exist only in the changed document are slotted into position. Two exceptions are worth knowing: if the same keys appear in a different order on each side, the original document's order is used for both so the panes stay aligned; and integer-like keys such as "1" and "2" are always listed first, which is a property of JavaScript objects rather than of this tool.
Why do the line numbers differ between the two sides?
Adding or removing a key shifts every line after it on that side. The two panes stay aligned row by row, so a row always shows the same piece of data on both sides even when its line numbers differ.
What is the difference between a missing key and a null value?
They are reported differently. A key present on one side only is added or removed; a key present on both with different values, including null, is changed.