Visual Studio Code Extension - Vibrancy Continued
Enable Acrylic/Glass effect in VS Code. Links: GitHub | Visual Studio Code Marketplace | issues Maintenance of this project is made possible by all the contributors and sponsors. If you'd like to sponsor this project and have your avatar or company logo appear below, click here. Any support is greatly appreciated 💖 ❗️ Important notice for Windows 10/11 userstl;dr YOU WON'T BE ABLE TO RESIZE THE VSCODE WINDOW unless you do thisBy default, when Vibrancy is installed on VSCode 1.86 and newer on Windows, your VSCode windows may stop being resizable, snappable or maximizable. This is a known issue related to VSCode 1.86 and Electron 27 and it occurs due to hardware acceleration leading to distorted text. Vibrancy will by default apply a mitigation that enables frameless windows, but this also causes issues with window interaction. The correct process to install Vibrancy on Windows is:
For more information, see issues #140 and #122. ⚠️ "Your VSCode installation appears to be corrupt"This extension works by editing VS Code's checksum-verified HTML files, which means that a warning prompt will appear after installing and enabling 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✔ macOS (Intel & Apple Silicon) ✔ Windows 10/11 (x64 & ARM64) Supported code editors✔ Visual Studio Code ✔ VSCodium ✔ Cursor (work in progress, see here for more info) Getting Started
Each time VS Code is updated, please re-enable Vibrancy using the same steps. If you're experiencing issues, please check the FAQs. OptionsType (
|
Theme | Screenshot |
---|---|
Default Dark | ![]() |
Dark (Only Subbar) | ![]() |
Noir et blanc | ![]() |
Tokyo Night Storm | ![]() |
Tokyo Night Storm (Only Subbar) | ![]() |
Solarized Dark+ (with theme: Solarized) | ![]() |
Catppuccin Mocha | ![]() |
GitHub Dark Default | ![]() |
You can contribute more themes! see here.
FAQs
How to uninstall Vibrancy?
Press F1 or ⌘+Shift+P and activate command "Disable Vibrancy", then restart Visual Studio Code.
You can also just uninstall the extension and restart VSCode, which will automatically remove Vibrancy.
Effect doesn't work correctly in VSCode 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).
EACCES: permission denied
when enabling Vibrancy on macOS?
Your installation of VSCode is owned by another user.
Run the following commands exactly as-is in the Terminal app to take ownership of the files, and enter your password when prompted:
sudo chown -R $(whoami):staff "/Applications/Visual Studio Code.app/"
sudo chmod -R 755 "/Applications/Visual Studio Code.app/"
A reinstallation will also fix this issue without any loss of settings.
EROFS: read-only file system
when enabling Vibrancy on macOS?
Your installation of VSCode is affected by App Translocation.
To fix this, either use the Finder and move VSCode to /Applications
(or move it out of /Applications
and then back in), or run the following terminal command:
sudo xattr -dr com.apple.quarantine "/Applications/Visual Studio Code.app"
I'm on Windows 10 and I'm experiencing lag when dragging the window
VSCode window cannot be resized/moved/maximized after enabling Vibrancy
Please see Important notice for Windows users at the top of the description.
Effect doesn't work, but there are no errors
Ensure that you don't have transparency effects disabled globally through your OS settings.
This can usually be found under Accessibility settings, and it may be called "Transparency effects" or "Reduce transparency." If that didn't help, you can also check the Console section in VSCode's Developer Tools, which can be accessed through the command palette.
If nothing else worked, try reinstalling VSCode, you won't lose any settings and this will ensure that your VSCode installation is consistent.
Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Vibrancy relies on user contributions, and as such, any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature'
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
When creating a PR, please target the development
branch.
License
Distributed under the MIT License. See LICENSE.txt
for more information.
Thanks ⭐
EYHN : for making the original Vibrancy that this is a fork of
be5invis/vscode-custom-css : The basis of this extension program
DIYgod : Fix issues with VSCode 1.36