Visual Studio Code Extension - Vibrancy
Mouse dragging lag in versions above 1809 of Windows 10, please do not install. See here: EYHN#5 (comment)
Enable Acrylic/Glass effect for your VS Code.
Links: Github | Visual Studio Code Marketplace | issues
Supported Operating Systems
Windows 7 ✔
Windows 10 ✔
MacOS ✔
Getting Started
- Make sure the color theme you selected is the 'Dark+ (default)'
-
Install this extension from the Visual Studio Code Marketplace.
-
Press F1 and Activate command "Reload Vibrancy".
- Restart.
Every time after Code is updated, please re-enable vibrancy.
Warning
This extension works by editting VS Code's css file. So, a prompt will appear when installing vscode-vibrancy for the first time or each time VS Code updates. U can click [never show again] to hide it.
To fix the "[Unsupported]" warning on VS Code's title bar, please refer to this extension: Fix VSCode Checksums.
Options
vscode_vibrancy.type
Native method of Vibrancy Effect.
- auto : Automatically switch with system version.
- dwm : (Windows 7 only) Windows Aero blur.
- acrylic : (Windows 10 only) Fluent Design blur.
- appearance-based, light, dark, titlebar, selection, menu, popover, sidebar, medium-light, ultra-dark: (MacOS only)
vscode_vibrancy.opacity
Opacity of Vibrancy Effect.
value: 0.0 ~ 1
vscode_vibrancy.theme
Select Vibrancy theme:
- Default Dark
- Dark (Only Subbar)
| Default Dark | Dark (Only Subbar) |
|---|---|
 |
 |
You can contribute more themes for us! see here.
vscode_vibrancy.imports
Import CSS/JS files, as file paths.
EXAMPLE: C:/Users/MyUserName/Documents/custom.css
value: array[]
FAQs
How to uninstall?
Press F1 and Activate command "Disable Vibrancy", and Restart Visual Studio Code.
Effect doesn't work for terminal?
Check your settings. You should change the renderer type of the terminal to dom.
"terminal.integrated.rendererType": "dom"
Thanks ⭐
be5invis/vscode-custom-css : The basis of this extension program
DIYgod : Fix issues with VSCode 1.36