VScode美化
RESULT:EVA-初号机 配色
![](https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230407130641790-375423512.png)
主题效果
1. 需要的东西
- vs code
- background 插件
- custom CSS and JS loader 插件
- 一些png素材,推荐网址:
- EVA Unit-1 Theme V2主题插件
2. 安装步骤
- 安装vscode
- 安装插件和主题
- 下载好相应的png图片
- 配置插件Custom CSS and JS loader:
将代码 "vscode_custom_css.imports": ["url"]
写入setting.json文件,url为css文件的网址。
我用的css是:
https://github.com/robb0wen/synthwave-vscode/blob/master/synthwave84.css
重启vscode ,Ctrl+Shift+P,运行命令:"Reload Custom CSS and JS".
- 配置插件background
这是我的配置代码:
"background.useDefault": false,
"background.styles": [
{
"content": "''",
"pointer-events": "none",
"position": "absolute",
"z-index": "99999",
"width": "100%",
"height": "100%",
// 调图片相对大小
"background-size": "30%",
// 调图片位置
"background-position": "100% 100%",
"background-repeat": "no-repeat",
// 透明度
"opacity": 0.70
}
],
"background.useFront": false,
"background.loop": true,
// ================================================
"vscode_custom_css.imports": [
"https://github.com/robb0wen/synthwave-vscode/blob/master/synthwave84.css"
],
"background.style": {
"content": "''",
"pointer-events": "none",
"position": "absolute",
"z-index": "99999",
"width": "100%",
"height": "100%",
"background-position": "100% 100%",
"background-repeat": "no-repeat",
"opacity": 1
},
// 启用插件
"background.enabled": true,
// 选择图片
"background.customImages": [
// 变形金刚
// "https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406105813152-297347202.png"
// 凌波丽和明日香
"https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406111032807-1859175386.png"
// only 明日香
// "https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406111247081-844415025.png"
// 职业装 凌波丽
// "https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406112224192-479334132.png"
// 战斗服 凌波丽
// "https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406112317752-1916155763.png"
// TIFA 01
// "https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230406112939903-1936578596.png"
],
- 选择主题为:EVA Unit-1 Theme V2
展示
![](https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230407133008968-312143758.png)
凌波丽-白色装
![](https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230407192505028-1587935585.png)
凌波丽和明日香
![](https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230407192806038-684073850.png)
红色战斗服-明日香
![](https://img2023.cnblogs.com/blog/2026433/202304/2026433-20230407192947850-859186362.png)
蒂法(滑稽.jpg)
本文来自博客园,作者:FE-有限元鹰,转载请注明原文链接:https://www.cnblogs.com/aksoam/p/17297177.html