How to Compare Two Files with the VS Code Diff Editor

The VS Code diff editor shows two files side by side with additions, deletions, and changes highlighted. You can compare any two files, review unsaved edits, or diff against clipboard contents.

The left pane always shows the original, and the right pane shows the modified version. Highlight colors mark the type of change:

• Green marks additions.
• Red marks deletions.
• Blue marks changed lines.

Compare two files from the Explorer

The fastest way to diff two files is through the Explorer.

Right-click the first file and select Select for Compare. A label appears on the file tab.

Right-click the second file and select Compare with Selected. The diff editor opens with the first file on the left and the second on the right.

This works with files in the same project, in different folders, or even in different workspace roots if you are using a multi-root workspace.

Compare against saved or clipboard

VS Code has two built-in shortcuts for common diff scenarios.

Press Ctrl+K D (Windows/Linux) or Cmd+K D (macOS) to compare the current file with its last saved version. Every unsaved edit shows up as a highlighted change. This is the fastest way to review your work before committing.

Press Ctrl+K C (Windows/Linux) or Cmd+K C (macOS) to compare the current file with your clipboard contents. The clipboard text appears on the right side of the diff editor. This is useful when a teammate sends a code snippet and you want to see how it differs from your version.

Both commands are also available from the Command Palette as File: Compare Active File with Saved and File: Compare Active File with Clipboard.

Compare any two files with the Command Palette

Open the Command Palette and run File: Compare Active File With.... A file picker opens. Browse to any file on your system and select it. The diff editor opens with the active file on the left and the selected file on the right.

Use this when the second file is not in your open project or when you prefer keyboard navigation over the Explorer right-click workflow.

Compare two new untitled files

Run File: Compare New Untitled Text Files from the Command Palette. Two empty editor panes open side by side. Paste content into each side and the diff updates live.

This is useful for comparing two snippets that are not saved as files: error messages, log excerpts, API responses, or any text you have copied.

Command-line diff

From the terminal, use the code command with the --diff flag:

bash

code --diff file1.js file2.js

This opens VS Code with the diff editor, even if no project is open. The first file appears on the left, the second on the right.

This is useful in scripts, Git hooks, or when you want to quickly compare two files from the command line without navigating through the interface. To compare a file against a previous Git revision instead of another file on disk, use the Source Control view or Timeline view described below.

Navigate the diff editor

Once the diff editor is open, you can navigate changes quickly:

• Press F7 to jump to the next difference.
• Press Shift+F7 to jump to the previous difference.
• Click the arrows in the gap between the two panes to copy a change from one side to the other. The left arrow copies the right version to the left. The right arrow copies the left version to the right.
• The minimap on each side highlights changed regions so you can see the overall distribution of differences at a glance.

Review Git changes

The diff editor integrates with VS Code's Git support. In the Source Control view, click any changed file to open a diff between the working version and the last commit.

For staged changes, click the file under Staged Changes to see what was staged. For a deeper Git workflow, see the guide on staging, committing, pushing, and pulling.

The Timeline view at the bottom of the Explorer also shows file history. Click any entry to open a diff against that point in time.

When the diff does not look right

If the diff editor shows entire files as changed when only a few lines differ, the issue is usually line endings or whitespace.

Open the Settings editor and search for diffEditor.ignoreTrimWhitespace. When enabled, VS Code ignores leading and trailing whitespace changes. Also enable diffEditor.renderSideBySide to confirm you are in side-by-side mode, not inline mode. Toggle between the two with the icon in the diff editor toolbar.

For more on VS Code's editing and navigation features, see the keyboard shortcuts cheat sheet and how to use the File Explorer.