vscode-blur
Make the Visual Studio Code window transparent and blurry so your desktop
wallpaper shows softly through the editor.
vscode-blur doesn't hack VS Code's UI or inject CSS. Instead it asks your
operating system's window manager / compositor to composite the whole VS Code
window with reduced opacity and a blur-behind effect — the same mechanism your
OS already uses for its own translucent surfaces.
| Platform |
Supported |
How it works |
| Windows 10 / 11 |
✅ |
PowerShell drives the DWM/User32 APIs (SetLayeredWindowAttributes + blur-behind accent policy). |
| Linux — KDE Plasma |
✅ |
wmctrl + xprop set window opacity and KDE's native blur-behind property (X11). |
| Linux — GNOME |
✅ |
Drives the Blur my Shell extension (works on Wayland and X11). |
| macOS |
❌ |
Not supported — macOS provides no way for an extension to set another app's window opacity/blur without patching the app. |
The effect is applied when VS Code starts and reverted when it closes.
After changing any setting you must restart VS Code for it to take effect.
Setup
Windows 10 / 11
- Enable transparency effects (required for the blur to render):
Settings → Personalization → Colors → turn Transparency effects on.
- Install the extension and restart VS Code.
No extra tools are needed — Windows ships with PowerShell and the DWM APIs used
here. If you use a locked-down machine where PowerShell script execution is
blocked by group policy, the effect may not apply.
Linux — KDE Plasma
Install the dependencies:
# Ubuntu / Debian
sudo apt install -y wmctrl x11-utils bash
# Arch
sudo pacman -S wmctrl bash
# Fedora
sudo dnf install wmctrl xorg-x11-utils bash
Make sure KDE's Blur desktop effect is enabled:
System Settings → Workspace Behaviour → Desktop Effects → under
Appearance enable Blur. Click the gear icon next to Blur to tune the
strength, then Apply.
Install the extension and restart VS Code.
KDE support uses xprop, so it targets X11 sessions. On a Wayland Plasma
session these X11 properties may be ignored.
Linux — GNOME
Install and enable the Blur my Shell extension:
# Fedora
sudo dnf install gnome-shell-extension-blur-my-shell
# Ubuntu / Debian
sudo apt install gnome-shell-extension-blur-my-shell
Or from the browser: https://extensions.gnome.org/extension/3193/blur-my-shell/
After installing, enable it (Extensions app) and restart your session.
Install the extension and restart VS Code.
vscode-blur automatically adds VS Code (WM class Code) to Blur my Shell's
application blur list and sets the opacity/blur to match your settings — no
manual configuration needed. The dconf tool (shipped with GNOME) must be
available.
macOS
Not supported. There is no supported way for a VS Code extension to make
another application's window translucent on macOS. The extension will show a
notice and take no action.
Extension settings
| Setting |
Type |
Default |
Description |
vscode-blur.opacity |
integer (0–100) |
88 |
Window opacity as a percentage. Lower = more transparent. |
vscode-blur.blur |
boolean |
true |
Enable/disable the blur-behind effect. |
Both settings require a restart of VS Code to take effect.
Usage
- Complete the setup for your platform (above).
- Install the extension.
- Restart the VS Code window.
That's it — enjoy the new look of your editor!
To turn the effect off, disable/uninstall the extension and restart VS Code.
The extension reverts opacity and blur on deactivation.
Troubleshooting
- Nothing changed after install — you must fully restart VS Code (close all
windows). The effect is applied on startup.
- Windows: transparent but no blur — enable Transparency effects in
Settings → Personalization → Colors.
- GNOME: warning about Blur my Shell — install and enable the Blur my
Shell extension, then restart your session.
- KDE: no effect on Wayland — the
xprop method targets X11. Log in to an
X11 Plasma session, or the properties will be ignored.
- Text looks faded too — this method sets whole-window opacity, so the UI
fades with the background. Raise
vscode-blur.opacity (e.g. to 92–95) for a
subtler effect.
License
MIT
