VsCode | 修改首页启动页 Logo

最终效果:

插件的安装

先安装插件 Custom CSS and JS Loader

插件配置

Ctrl + Shift + P 输入

打开用户设置,在末尾添加

json 复制代码
"vscode_custom_css.imports": [""]

下载 Logo
点我下载

引入图片

创建一个文件夹 Vs_code_config,里面放入 user.css

cpp 复制代码
.editor-group-watermark > .letterpress{
  background-image: url("https://raw.githubusercontent.com/Aikoyori/ProgrammingVTuberLogos/main/VSCode/VSCode-Thick.png") !important;
  opacity: .75;
  aspect-ratio: 3/2 !important;
}

但是会因为网络原因可能加载不出来。所以我们可以通过将图片转换 base64 来进行访问。
base64编码在线转换网站

然后将这些编码粘贴到 url 里面,替换掉原先的网页链接并保存

引入 css

回到用户的 settings.json

将之前输入的改为,其中 file:/// 之后是你 user.css 存放的路径

json 复制代码
"vscode_custom_css.imports": ["file:///D:/VS_code_config/user.css"]

让插件生效

Ctrl + Shift + P 输入 >Enable...

点击 Enable Custom CSS and JS

重启 VsCode 生效

相关推荐
梦幻通灵6 小时前
IDEA通过Contince接入Deepseek
java·ide·intellij-idea
鸡啄米的时光机6 小时前
vscode的一些实用操作
vscode·学习
Aphelios3809 小时前
Linux 下 VIM 编辑器学习记录:从基础到进阶(上)
java·linux·编辑器·vim
灰色人生qwer10 小时前
React + TypeScript+ Vite 配置路径别名和vscode智能路径提示
vscode·react.js·typescript
workflower11 小时前
实例研究:设计一个文档编辑器(24)- 完
java·开发语言·设计模式·编辑器·软件工程·需求分析·软件需求
莲动渔舟11 小时前
赶AI大潮:在VSCode中使用DeepSeek及近百种模型的极简方法
ide·人工智能·vscode·deepseek
咩咩大主教12 小时前
VSCode运行Go程序报错:Unable to process `evaluate`: debuggee is running
开发语言·ide·vscode·golang·编辑器
佛曰我不想说话12 小时前
通过VSCode直接连接使用 GPT的编程助手
ide·vscode·copilot
羊村懒哥15 小时前
VScode内接入deepseek包过程(本地部署版包会)
人工智能·vscode·deepseek