我的VSCode不可能这么可爱

最新推荐文章于 2025-04-01 10:40:54 发布

夜鸦DX

最新推荐文章于 2025-04-01 10:40:54 发布

阅读量1k

点赞数 7

分类专栏： VSCode 文章标签： vscode ide 编辑器

本文链接：https://blog.youkuaiyun.com/qd1014751893/article/details/140539639

版权

VSCode 专栏收录该内容

1 篇文章

订阅专栏

我的VSCode不可能那么可爱

vscode启动页

不懂Hack的开发不是好程序员，我是夜鸦，行走在hack路上不安分的程序员

今天给大家带来的是修改VSCode的启动Logo，让你的编辑器增添亿点点活泼，亿点点可爱~

下载vscode插件 (Custom CSS and JS Loader)

众所周知，vscode的启动页是不能被主题所修改的，要修改启动页的话只能修改vscode的配置文件，但vscode更新又比较频繁，每次更新后修改又会失效，所以需要下载插件来修改配置，避免每次更新vscode都失效。

下载后通过Enable Custom CSS and JS启用

之后如果更新vscode，只需Ctrl+P输入执行命令Reload Custom CSS and JS即可重新生效

修改setting.json

“Custom CSS and JS Loader” 插件是通过修改setting.json配置文件实现注入的，Ctrl+p输入Open User Settings(JSON)即可快速打开编辑器的配置文件

新增一行配置

"vscode_custom_css.imports": [
	"https://raw.githubusercontent.com/Aikoyori/ProgrammingVTuberLogos/main/ReplaceGuide/VSCode/style.css"
]

括号里面是css样式地址，也可以是本地地址，比如我的用户名是a，则

"vscode_custom_css.imports": [
	"file://C:/Users/a/.vscode/custom.css"
]

custom.css文件是自己生成的，里面的内容如下

.editor-group-watermark {
  max-width: 500px !important;
  padding-left: 1em;
  padding-right: 1em;
}

.editor-group-watermark .letterpress {
  background-image: url("这里填图片base64格式或者http图片地址") !important;
  aspect-ratio: 8/5 !important;
}