VS Code主题设置(美化VS Code)(主题+背景+图标+特效+字体)

目录

切换整体主题(整体主题)

切换文件图标主题              

设置VS Code背景图案

字体特效 + 连击特效

字体设置

主题的具体效果放在了文章末尾,这篇文章后续也会进行更新

———————————————————————————————————————————

切换整体主题(整体主题)

        1.VS Code内置主题(快捷键:Ctrl+K ,Ctrl+T)

                1.VS Code左上角点击文件

                

                2.选择首选项-->主题-->颜色主题

                

        2.扩展主题

                1.左侧工具栏,点击扩展

                

                2.搜索栏搜索自己想要的主题后点击安装就行
                3.一些主题

                        Material Theme

                        Dracula Official

                        One Dark Pro

                        Field Lights Theme

                        Panda Syntax

                        Atom One Dark

                        Nord

                        Tokyo Night

                        Tiny Light

———————————————————————————————————————————

切换文件图标主题

        1.VS Code内置主题(快捷键:Ctrl+K ,Ctrl+T)

                1.VS Code左上角点击文件

                

                2.选择首选项-->主题-->文件图标主题

                

        2.扩展主题

                1.左侧工具栏,点击扩展

                

                2.搜索栏搜索自己想要的主题后点击安装就行
                3.一些主题                   

                        Material Icon Theme

———————————————————————————————————————————

设置VS Code背景图案

        1.左侧工具栏,点击扩展

          

        2.搜索background下载

        3.VS Code左上角点击文件-->首选项-->设置                                                                    

        4.搜素background并点击

        

        5.点击添加项,写入路径

                如果是自己电脑的图片,则输入

file:/// + 文件路径
例file:///C:/Users/DELL/Desktop/14.png

        

        6.修改透明度

                opacity只要不是1就行,0.1~0.5直接就好

        

        7.修改图片大小

                修改background-size就行,把auto改成"100% 100%"啥的

                第一个为宽度,第二个为高度

        8.以上为代码块背景,下面是全屏背景设置

"background.fullscreen": {
        "images": ["刚才的路径"], 
        "opacity": 0.91, // 0.85 ~ 0.95 
        "size": "cover", 
        "position": "center", 
        "interval": 0 
    }

                这段代码复制进去就行

        

———————————————————————————————————————————

字体特效 + 连击特效

        1.插件搜索Power Mode

        2.启动插件

                设置搜索powermode

                

        3.调字体特效 

        

        4. 取消抖动

        

        5.调节连击时间

                (和自动保存有冲突)

        

———————————————————————————————————————————

字体设置

        1.下载字体(这里仅附上路径,具体方法在文末)

                https://github.com/tonsky/FiraCode

        2.设置字体

                1.打开设置-->文本编辑器-->字体

                

                2.添加刚才下载的字体

                

                3.设置连体字

                         比如,!=会被自动缩写为=>会被缩写为

                

                        打开settings.json

                        找到editor.fontLigatures,改成true就行

"editor.fontLigatures": true

———————————————————————————————————————————

效果

        默认主题(太多了,仅展示几个)

                现代浅色 Default Light Modern

                Quiet Light

                Solarized Light

                红色 Red

                深色+ Default Dark+

        Material Theme(太多了,仅展示几个)

                Material Theme Darker

                Material Theme Deepforest

                Material Theme Ocean

                Material Theme Palenight

        Dracula Official

        One Dark Pro

        Field Lights Theme

        Panda Syntax

        Atom One Dark

        Nord

        Tokyo Night

        Tiny Light

———————————————————————————————————————————

        默认主题

                Seti

                

        Material Icon Theme

        

        Field Lights        (Field Lights Theme)

        

———————————————————————————————————————————

        背景图效果(半屏)

        背景图效果(全屏)

其他

        字体下载教程

                https://github.com/tonsky/FiraCode        (这个的)(Windows端)

                1.打开后下划找到

                直接下载就行

                2.打开下载的文件夹,找到ttf文件夹解压缩

                

                3.打开后安装里面的所有文件就行(全选,鼠标右键安装)

                

ctrl +        放大

ctrl -        缩小

<think>好的,用户想知道如何在VSCode中修改或自定义字体。首先,我需要回忆一下相关的步骤,并查看提供的引用资料来确保准确。 根据引用[2],用户需要知道字体的准确名称才能进行设置。这可以通过访问系统的Fonts文件夹或者使用工具查找。引用[3]提到在settings.json中添加字体名称,例如"Fira code",并启用连字功能。引用[4]则指出可以在设置中调整字体大小和主题颜色,而引用[1]提到了修改文本颜色的方法,虽然用户主要关注字体,但可能相关。 首先,用户可能需要通过图形界面或直接编辑settings.json来设置字体。图形界面比较简单:打开设置,搜索“font”,然后找到字体相关的选项。但直接编辑settings.json更灵活,可以同时调整多个参数,比如字体家族、大小和连字。 然后,确保用户正确安装了所需的字体,否则设置可能无效。引用[2]和[3]都提到需要安装字体文件,并找到准确名称。比如,安装Fira Code后,在设置中使用其名称。 可能需要注意的常见问题包括:字体名称拼写错误、未安装字体、或者设置语法错误。需要提醒用户检查这些点。此外,引用[4]提到字体大小的设置位置,用户可能需要调整大小,所以应该包括这部分步骤。 最后,生成相关问题时要覆盖扩展设置、颜色调整、多字体配置和重置默认值,这些都与主题相关,帮助用户进一步自定义环境。</think>### 如何在 VSCode 中修改或自定义字体 #### 方法 1:通过图形界面设置 1. **打开 VSCode 设置** - Windows/Linux: `Ctrl + ,` - macOS: `Cmd + ,` 2. **搜索“字体”相关选项** - 在搜索栏输入 `font`,找到以下关键设置: - `Editor: Font Family`:输入字体名称(需准确,如 `Fira Code`)[^3] - `Editor: Font Size`:调整字体大小(如 `14`)[^4] 3. **保存生效** - 修改后自动保存,编辑器界面即时更新。 #### 方法 2:直接编辑 `settings.json` 1. **打开配置文件** - 按下 `Ctrl + Shift + P`,输入 `Preferences: Open User Settings (JSON)`。 2. **添加字体配置** ```json { "editor.fontFamily": "Fira Code, Consolas, monospace", // 字体优先级从前往后 "editor.fontSize": 14, // 字体大小 "editor.fontLigatures": true // 启用连字效果(需字体支持) } ``` - **注意**:字体名称需与系统安装的名称完全一致,可通过系统 `Fonts` 文件夹或工具(如 `Everything`)查询[^2]。 3. **重启 VSCode** - 部分配置需重启后生效。 #### 验证字体是否生效 - 若字体未生效,检查以下问题: 1. 字体名称拼写错误(如空格、大小写)。 2. 字体未正确安装(需双击 `.ttf` 文件安装)[^3]。 3. 配置语法错误(如 JSON 格式逗号缺失)。 ---
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

博丽七七

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值