Ai /post/tech/r… If reproduced, please indicate the source
1 Install custom JS and CSS plug-ins
2 Install the glow theme
3 Add a style profile
In the VSCode installation directory (or a folder of your own choice), place the following files. In order to download the file, the Github-Jinkeycode/vscode-transparent-glow, welcome star.
Enable-electronic-vibrancy. Js Enables the electron transparent support
vscode-vibrancy-style.css
Synthwave84.css text glow style, styles available at Github. If not, use synthwave84-noglow.css instead. You can watch github.com/robb0wen/sy… Stay informed.
After introducing the style configuration above, some of the left navigation bar titles are still not transparent. I changed the configuration myself and introduced them.
Terminal. CSS makes the built-in terminal transparent in vscode
Terminal cursor color modification, courtesy of @Manonloki
.panel.integrated-terminal .xterm-cursor, .xterm-cursor-block { background: rgb(210, 0, 252) ! important; }Copy the code4 Modify the VSCode configuration file
Edit it in setting.json
You don’t need braces
Five heavy load
Press Ctrl + Shift + P and run “Reload Custom CSS and JS” to restart vscode. If VSCode is damaged, select “do not prompt” on the upper right corner gear.
If reload failed on some computers, please move vscode in admin mode
sudo code --user-data-dir="~/.vscode-root"
Copy the code6 summarizes
The finished effect is shown in the figure, do not understand can add small assistant wechat UDujjb pull you into the group inquiry
The above tutorial is based on MacOS. For Linux users, see how to enable transparency. Windows electron does not support vibrancy mode for now. You can use the GlassIt-VSC plug-in to set transparency.
Custom CSS and JS Loader configuration
Linux Transparent Window
Windows can only be transparent + luminous
1. Install plug-in:
1.SynthWave ’84
2.Custom CSS and JS
3.GlassIt-VSC
2. Download the configuration file (either of the following methods) :
1. Install git Clone github.com/Jinkeycode/…
2. The browser to access codeload.github.com/Jinkeycode/…
Update vscode configuration file setting.json(add the following code to the setting.json file):
"vscode_custom_css.imports": ["file:///C:/Users/Administrator/AppData/Roaming/Code/User/vscode-transparent-glow-master/synthwave84.css",]Copy the code“C: / Users/Administrator/AppData/Roaming/Code/User/vscode – transparent – glow – master/” this replaced with location of the file you downloaded in step 2
Press Ctrl + Shift + P, run “Reload Custom CSS and JS”, and restart VSCode.