vscode原生不支持窗口级透明背景,仅能通过workbench.colorcustomizations设置编辑区、侧边栏等webview内ui元素的透明色(需#rrggbbaa格式),真正透底须用系统级补丁(如windows的vscode-transparency)或插件(如glassit-vsc)。

VSCode 原生不支持“透明背景”这个说法——你调的只是编辑区、侧边栏这些 UI 元素的背景色,不是窗口本身;想看到桌面壁纸,必须用系统级补丁或插件配合,且各区域互不影响。
workbench.colorCustomizations 只能改 Webview 内元素
这个配置项作用范围非常有限:它只影响 editor.background、sideBar.background、panel.background 这类在 Electron 渲染层内的颜色值,永远穿不透窗口容器。
- 设成
"#00000000"后,编辑区看似透明,底下仍是 VSCode 默认灰白底(不是你的桌面) - 标题栏、滚动条、
Ctrl+P命令面板、右键菜单、任务栏缩略图——全都不响应这个配置 - 某些主题(如
One Dark Pro)会主动覆盖你写的editor.background,导致设了也白设 - 颜色值必须用
#RRGGBBAA格式(比如"#1e1e1e80"),AA是十六进制透明度,00= 全透,FF= 不透
Windows 下真·窗口透明只能靠 vscode-transparency 补丁
这是目前 Windows 10 2004+ / Windows 11 上唯一稳定支持 Acrylic/Mica 模糊 + 窗口级 alpha 的方案,原理是替换 Electron 渲染入口并调用 DWM API。
- VSCode 1.86+ 必须用补丁 v1.12+,否则启动报错:
Cannot find module 'vs/base/common/platform' - 配置写在
%APPDATA%\Code\User\settings.json中:"transparency.opacity": 0.85、"transparency.blur": "acrylic" - 必须加启动参数
--disable-gpu,否则模糊失效或闪烁 -
window.titleBarStyle必须设为"custom";设成"native"会直接关闭透明通道 - 别信网上教你在
electron.launchArgs里加--enable-transparent-visuals的方法——Electron 23+ 已废弃该参数,加了也没用
background 插件只作用于编辑器内容区
这类插件(如 shalldie.background 或 background-cover)本质是往 DOM 注入一个带 opacity 的图片层,和“窗口透明”完全无关。
- 安装后需在
settings.json中配background.enabled开关 -
background.useDefault关掉才能自定义图片;background.style用 CSS 控制展示逻辑,例如:"background-size": "cover"、"opacity": "0.15" - 它只影响编辑器内容区,终端、标题栏、侧边栏内容等区域完全不受影响
- 插件自带的图片(比如卡通角色)是覆盖层,不是底层透明;升级 VSCode 时不会被覆盖,但手改
main.css会被清掉 - 推荐透明度值控制在
0.1~0.3之间;超过0.6插件会自动截断为默认值
终端背景要单独设,且依赖系统能力
terminal.integrated.background 和 editor.background 完全独立,不继承、不联动,也不能靠它让终端窗口变透明。
- 设成
"#00000000"后,终端背景仍是 VSCode 默认色,除非你已启用vscode-transparency或GlassIt-VSC - Windows 终端透明效果受 DWM 合成器限制,旧版系统(如 Win10 1909)可能完全无反应
- macOS 上若禁用原生标签页(
"window.nativeTabs": false),可缓解 Mission Control 缩略图不透明问题 - 不要试图用 CSS 强行覆盖
.terminal-container,容易引发渲染异常或文字发虚
真正难的不是怎么设,而是分清「UI 层透明」「窗口级透明」「背景图叠加」三者的边界——混着调,轻则无效,重则闪屏、文字模糊、快捷键失灵。补丁和插件不是开关,是不同层级的工具,用错地方,连重启都救不回来。











