想要设置vscode的主题、背景、字体颜色、括号颜色这里都能找到相应的修改方式
背景图片
1、在扩展程序中搜索background-cover插件进行安装
2. ctrl + shift +p 输入命令
backgroundCover - start
3.选择自己喜欢的图片然后在重启vscode即可
然后你就会发现你的vscode顶部出现了不"接受支持",惊不惊讶意不意外,这个东西是因为修改了一部分code代码,然后显示文件损坏,但是并不会影响软件的运行,但是我这个人有点强迫症不喜欢看到这几个字。
所以解决问题的办法来了!!!
在扩展程序中找到 Fix VSCode Checksums 这个插件
4、安装好插件后 ctrl + shift +p 输入命令
Fix Checksums: Apply
完成后重启vscode就ok了!
如果你要调整背景的透明度的话可以打开vscode文件位置到workbench.desktop.main.css这里去修改就好了
主题
当然有背景图了还缺个漂亮的主题,我整理了几个下载量比较多的主题看看有没有自己喜欢的吧!
1. Atom One Light
Atom One Light主题是安装次数最多的light主题,拥有超过300K的安装量,这是一个受欢迎的Light主题。该主题基于Atom的One Light主题,并且是市场上评价最高的Light主题之一。
2. Github Light
Github的Light主题看起来很干净。顾名思义,它是基于GitHub的外观和视觉创建的,所以看起来应该很熟悉。
3. Snazzy Light
据笔者了解,这个主题的主要目标是在明亮的环境光条件下表现出清晰鲜明的色彩。当然如果你搭配上暖色调的背景那就会有出其不意的效果。
4. Primer Light
尽管这个主题只安装了9K多一点,但Primer Light是一个外观很棒的主题。这个主题是一个从Sublime Text移植的,因此,这个主题可能看起来很熟悉你,如果你以前用过Sublime Text。
5. Monokai Light
Monokai Light主题因其鲜艳的色彩而脱颖而出,这是Monokai配色方案的特点。这相当于Visual Studio Marketplace上的各种深色Monokai主题的浅色版。
6. Bluloco Light
Bluloco Light是一个奇特而又复杂的主题,在调色板中有各种各样的颜色。这个主题的特点是更全面地使用了语法范围和颜色的一致性,并充分考虑到美观、对比和可读性。
7. Blue Light
Blue Light是一种大多数为蓝色的主题——正如你可以通过其名称来分辨的那样。这个主题的目标是尽可能的保持简单。例如,为了消除和避免干扰,只使用了几种颜色,无论是UI还是语法着色。除此之外,红色的颜色只用于错误。
8. Solarized Light
Solarized Light主题还有有一个暗色版本。这个主题的Light版有一个非常有特色的背景颜色,你要么爱要么恨
自定义颜色
当然肯定有人并不满意,因为每个人都有自己的审美,最求完美是天性。
下面就是修改字体和括号颜色的代码了!可以根据自己的喜好设置。
字体颜色
把这段代码放在 settings.json里就ok了
// "editor.tokenColorCustomizations": {
// "comments": "#0e8a43", // 注释
// "keywords": "#0ddbca", // 关键字
// "variables": "#f78888", // 变量名
// "strings": "#0ddbca", // 字符串
// "functions": "#e1fc68c9", // 函数名
// "numbers": "#ff81ee" // 数字
// },
// // 选中高亮的颜色
// "workbench.colorCustomizations": {
// // "editor.selectionBackground": "#f5f5f5"
// }
括号颜色
安装Brackets Pair Colorize 2扩展插件
1、打开扩展
2、点击 Brackets Pair Colorize 2 右下角的齿轮
3、选择最后一项 扩展配置
4、选择 Brackets Pair Colorize 2: Colors 中的 在 settings.json 中编辑
5、根据需要编辑 settings.json 文件,自定义颜色顺序
在这里面就能设置自己喜欢的括号颜色啦,当然我没有修改括号的颜色,我觉得默认的就挺好的,如果不满意的话可以自己去调试括号的颜色顺序。
"bracket-pair-colorizer-2.activeScopeCSS": [
"borderStyle : solid",
"borderWidth : 1px",
"borderColor : {color}",
"opacity: 0.5"
]
这些vscode的外观设置基本上都在这了,简直就是一条龙服务,大家不用在去苦苦憨憨的一个个去找了,我都整理出来了,方便大家查找。