Visual Studio Code Extension - Vibrancy Continued
The original extension has been deprecated, this version will continue to be supported and receive community updates.
Windows 10 users may have a slight mouse lag when moving the window, please read here for details.
For questions about installation and uninstallation, please read FAQs.
Enable Acrylic/Glass effect in VS Code.
Links: GitHub | Visual Studio Code Marketplace | issues
Warning
This extension works by editing VS Code's checksum-verified CSS file, which means that a warning prompt will appear after installing and enabling vscode-vibrancy-continued
. This warning is safe to disregard, and all changes can be reverted. Click on the cogwheel and select Don't Show Again to hide it.
To fix the "[Unsupported]" warning on VS Code's title bar, please refer to this extension: Fix VSCode Checksums.
Supported Operating Systems
Windows 11
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 VS Code is updated, please re-enable Vibrancy.
Options
vscode_vibrancy.type
Native method of Vibrancy Effect.
- auto : Automatically switch with system version.
- 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 Light
- Light (Only Subbar)
- Noir et blanc
Theme | Screenshot |
---|---|
Default Dark | |
Dark (Only Subbar) | |
Noir et blanc |
You can contribute more themes! 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 Vibrancy?
Press F1 or ⌘+Shift+P and activate command "Disable Vibrancy", then 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.gpuAcceleration": "off"
Prompt "Run Visual Studio Code with administrator privileges"?
It usually appears on windows when you are using the VSCode System Installer. You should close VSCode completely, then run VSCode as administrator and retry what you did before (Enable/Reload/Disable Vibrancy).
⭐
Thanks EYHN : for making the original extension that this is a fork of
be5invis/vscode-custom-css : The basis of this extension program
DIYgod : Fix issues with VSCode 1.36