VS Code extension: chat diff blocks hardcode Monaco theme "vs-dark", ignoring light themes
Summary
Chat diff blocks in the VS Code extension are always dark, ignoring both the VS Code color theme and the Claude Code theme setting. On a light VS Code theme the entire chat UI is light while every tool-call diff renders on a black background.
Environment
- Extension:
anthropic.claude-code2.1.246 (win32-x64) - VS Code on Windows 11 Pro 26100
- VS Code color theme: light
- Claude Code
theme: triedlightvia both/config theme=lightand"theme": "light"in~/.claude/settings.json— no effect
Cause
In webview/index.js, the two Monaco diff editors used for tool-call diffs are constructed with a hardcoded theme:
monaco.createDiffEditor(ref.current, {
readOnly: true, renderSideBySide: true, renderOverviewRuler: false,
scrollBeyondLastLine: false, minimap: { enabled: false }, automaticLayout: true,
theme: "vs-dark", // <-- hardcoded
fontSize: 12, lineNumbers: "off", wordWrap: "on", ...
})
Both call sites pass the literal "vs-dark"; there are zero occurrences of theme:"vs" in the bundle. Nothing in contributes.configuration or in the settings schema (claude-code-settings.schema.json, which does define theme) reaches these editors.
Expected
The Monaco theme should follow the resolved Claude Code theme setting, or at minimum the host window's ColorThemeKind:
light/light-*→"vs"dark/dark-*→"vs-dark"- high contrast →
"hc-light"/"hc-black"
theme: "auto" should track the VS Code theme live.
Repro
- Set VS Code to any light color theme.
- Run
/config theme=lightin the Claude Code panel. - Have Claude edit any file.
- The diff block in the chat renders on a black background.
Workaround
Replacing both theme:"vs-dark" literals with theme:"vs" in the installed webview/index.js fixes it after a window reload, but is wiped on every extension update.