Code diff viewer — compare two versions by line, word or character

How to use the code diff viewer

1. Paste the old version into Original and the new one into Changed. A small JavaScript edit is loaded as a sample.
2. Pick what to Compare: Lines, Words or Characters.
3. Tick Ignore whitespace changes if indentation or spacing edits should not count.
4. Set Context lines in the patch (0–20, default 3).
5. Read the Added, Removed and Unchanged counts and the highlighted Differences, then copy or download the Unified diff as changes.diff.

What it does and when to use it

Use it when Git is not at hand: to check what changed in a snippet sent by chat, compare a config file from two servers, or review an edited query before running it. The highlighted view is quick to scan, and the unified diff gives you something precise to paste into a ticket or code review.

A typical workflow is to run code through the Python code cleaner or the code beautifier, then paste the before and after here to confirm only layout changed. For plain prose, the text diff tool is simpler, and JSON diff compares data by key rather than by line.

How it works

The tool uses the jsdiff library in your browser, so neither version is uploaded:

• Lines runs a line diff and draws a table with the old line number, the new line number, a − or + marker and the line text. Removed lines are red and added lines green, in light and dark themes.
• Words and Characters show one block of text with removals struck through and additions highlighted.
• The Unified diff is always line-based, whatever the compare mode, with the number of unchanged context lines you set around each change.

If both boxes hold exactly the same text, you see “The two inputs are identical.” instead.

Worked examples

These are the tool’s own outputs.

The sample. The function gains a greeting parameter and a template string. Result: Added: 2 lines, Removed: 2 lines, Unchanged: 2 lines, and the patch starts @@ -1,4 +1,4 @@.

One setting changed, no context. Comparing two three-line configs where only host: localhost became host: 0.0.0.0, with Context lines set to 0, gives this patch body:

@@ -2,1 +2,1 @@
-host: localhost
+host: 0.0.0.0

A word edit. “The quick brown fox” against “The quick red fox” in Words mode marks brown as removed and red as added, with the rest unchanged.

Re-indentation only. A block whose run(); moved from 2 to 4 spaces, with Ignore whitespace ticked, reports Added 0, Removed 0, Unchanged 3.

Limits and tips

• Moved blocks show as removed and added; the diff does not detect moves.
• Very large inputs can be slow in Characters mode. Use Lines for whole files.
• Line endings matter. The same file saved with Windows (CRLF) and Unix (LF) line endings shows its lines as changed. Tick Ignore whitespace changes, or convert both with the whitespace normalizer first.