Diff Themes

Diff Themes adds focused color overlays for VS Code diff and merge editors. It does not replace your syntax theme or recolor the rest of the workbench.

Nothing changes after installation until you select a preset.

Presets

• Balanced uses familiar green and red channels with moderate emphasis.
• Subtle lowers the intensity for long review sessions.
• High Contrast strengthens fills and structural borders.
• Colorblind Friendly uses blue and amber instead of green and red.
• Custom uses a JSON configuration supplied in VS Code settings.

Each preset adapts to light, dark, high-contrast light, and high-contrast dark themes.

Usage

1. Open the Command Palette.
2. Run Diff Themes: Select Theme.
3. Choose a preset.

You can also use the paint-can button in the title bar of a diff editor.

Run Diff Themes: Select Highlight Style to choose one of:

• Full for word, line, gutter, and overview highlights.
• Lines Only to remove the stronger changed-word layer.
• Words Only to remove line and gutter fills.
• Minimal to show changes only in gutters and overview rulers.

Run Diff Themes: Restore Default Diff Colors or select Off to restore the global diff colors that existed before the extension applied its overlay.

Custom JSON Themes

Set diffThemes.activePreset to custom, then add diffThemes.customTheme to your user settings.json:

{
  "diffThemes.activePreset": "custom",
  "diffThemes.highlightStyle": "full",
  "diffThemes.customTheme": {
    "name": "Ocean Sunset",
    "dark": {
      "added": "#38BDF8",
      "removed": "#FB7185",
      "neutral": "#94A3B8",
      "moved": "#C084FC"
    },
    "light": {
      "added": "#0369A1",
      "removed": "#BE123C",
      "neutral": "#475569",
      "moved": "#7E22CE"
    },
    "opacity": "balanced",
    "overrides": {
      "diffEditor.insertedLineBackground": "#38BDF81F",
      "diffEditor.removedLineBackground": "#FB71851F"
    }
  }
}

Each base channel uses #RRGGBB. Exact overrides accept #RGB, #RGBA, #RRGGBB, or #RRGGBBAA. Unknown keys and invalid colors are ignored.

What Is Styled

• Side-by-side and inline diff editors
• Inserted and removed words, lines, gutters, and overview rulers
• Moved and unchanged regions
• Multi-file diff headers and surfaces
• Inline merge conflicts
• The three-way merge editor

SCM gutter decorations and inline-chat edit colors are intentionally outside the version 1 scope.

Existing Customizations

Diff Themes modifies only top-level global entries in workbench.colorCustomizations. Unrelated entries are preserved.

If matching colors are configured for the active theme, workspace, or workspace folder, VS Code gives those values higher precedence. Diff Themes reports these overrides and offers to open the relevant setting, but never changes workspace or folder settings.

Manual edits to managed global colors are preserved when the overlay is restored. Recovery information is synchronized with Settings Sync.

Important Limitations

• Run Diff Themes: Restore Default Diff Colors before uninstalling. VS Code does not provide extensions with a reliable uninstall cleanup hook.
• Global color customizations are shared by VS Code windows. If simultaneous windows use different light and dark theme kinds, the most recently applied variant wins.
• VS Code 1.85 supports the multi-file diff header color. The multi-file background and border colors are added on VS Code 1.86 and newer.