首页 > 其他分享 >VSCode自定义颜色样式以及背景图片

VSCode自定义颜色样式以及背景图片

时间:2023-02-14 15:32:56浏览次数:39  
标签:自定义 VSCode fffae5 activityBar terminal statusBar background integrated 背景图片


​"terminal.integrated.fontFamily": "Meslo LG M for Powerline"​

看以前的‘美化’太丑了,还是吸血鬼好看

VSCode自定义颜色样式以及背景图片_前端


VSCode自定义颜色样式以及背景图片_f5_02

"workbench.colorCustomizations": {
"activityBar.background": "#5415f5",
"activityBarBadge.background": "#666",
"activityBar.inactiveForeground": "#fff",
"activityBar.activeBorder": "#fff",
"activityBar.foreground": "#f55",
"titleBar.activeBackground": "#5415f5",
"titleBar.activeForeground": "#FFF",
"statusBar.background": "#5415f5",
"sideBarSectionHeader.background": "#5415f5",
"sideBarSectionHeader.border": "#fff",
"sideBarTitle.foreground": "#51f",
}

VSCode自定义颜色样式以及背景图片_f5_03


设置setting.json

vscode更新会将自己设置的样式复原,记录在此,下面是背景的设置和编辑器的样式设置,要添加图片背景要下载background这个插件

图片是抠出来的,供出,我这有个插件保存后是png格式的,背景是透明的,如果不是可以找我要,我私发你

VSCode自定义颜色样式以及背景图片_f5_04

VSCode自定义颜色样式以及背景图片_f5_05

"background.useDefault": false,
"background.customImages": [
"file:///C:/Users/Dell/Pictures/great/1.png"
],
"background.useFront": false,
"background.style": {
"top":"0x",
"right":"120px",
"width":"130%",
"height":"100%",
"background.repeat":"no-repeat",
"background-size":"contain",
"opacity":0.5
},
"workbench.colorCustomizations": {
"editor.background": "#FFFAE5",
"editorGutter.background": "#FFFAE5",

"titleBar.activeBackground": "#ffffff",
"titleBar.activeForeground": "#026e3f",
"menu.background": "#FFFAE5",
"menu.foreground": "#1213128e",

"activityBar.background": "#FFFAE5",
"activityBar.foreground": "#0d7f37",
"sideBar.background": "#FFFAE5",
"sideBar.foreground": "#198a08",
"sideBarSectionHeader.background": "#f0e7c6",

"tab.activeBackground": "#fffae5",
"tab.activeForeground":"#000",
"tab.inactiveBackground": "#fffae5",
"tab.inactiveForeground": "#5b605fa0",

"editor.selectionBackground": "#ccc",
"editor.selectionHighlightBackground": "#e4d79b",

"statusBar.background": "#6fdc85e9",
"statusBar.debuggingBackground": "#fffae5",
"statusBar.noFolderBackground": "#fffae5",

"terminal.integrated.cursorBlinking": true,
"terminal.integrated.lineHeight": 1.2,
"terminal.integrated.letterSpacing": 0.1,
"terminal.integrated.fontSize": 15, //字体大小设置
"terminal.integrated.fontFamily": "Lucida Console", //字体设置
"terminal.integrated.shell.linux": "/bin/zsh"
}

补个底部状态栏的设置

"statusBar.background": "#fffae5",
"statusBar.debuggingBackground": "#fffae5",
"statusBar.noFolderBackground": "#fffae5",
"statusBar.foreground":"#07511c",

VSCode自定义颜色样式以及背景图片_f5_06


VSCode自定义颜色样式以及背景图片_ci_07


标签:自定义,VSCode,fffae5,activityBar,terminal,statusBar,background,integrated,背景图片
From: https://blog.51cto.com/u_15964288/6056982

相关文章

  • 自定义数据库项目工程
      各模块功能及依赖总结通过几个例子,来看一下各个模块之间是怎么相互工作的.总结来自NYADB作者,针对声哥的源码进行简单修改。https://qw4990.gitbooks.io/nyadb/c......
  • VsCode运行VUE3出现错误
        1.首先查看vscode版本2.安装最新稳定的nodejs可以在注册表查看一些有效或者无效的路径  可以cmd查看node-v  和 npm-v3.如果出现一些提示vite......
  • vscode浏览器打开html
    1.点击拓展2.输入openinbrowser,选择第一个3.点击安装......
  • Vscode如何新建html文件
    1、点击OpenFolder: 2、选择目标文件夹,在本地新建一个拓展名为html的文件: 3、在第1行输入!(英文状态下),按tab键,新建成功。界面如下图所示: ......
  • Linux--Install vscode server
    1要做的工作1.1获取vscode的commitid1.2从https://update.code.visualstudio.com/commit:${commit_id}/server-linux-x64/stable下载vscodeserver1.3将vscode......
  • Android 自定义变化的文本控件ColorChangeView
    实例图说明图/***有颜色过渡变化的textview**@ProjectApp_View*@Packagecom.android.view.colortextview*@authorchenlin*@version1.0*@NoteTODO*//*......
  • mysql 循环批量建表(表结构相同,表名可以自定义)
    1.情景展示现在有这样一种需求:我需要建两百多张表,这些表的表结构相同,表的名称也是提前拟定好的,必须使用指定的表名;如果使用一个个写SQL语句,那不还得累死,所以,我想到了可不可......
  • C# WPF UI开发自定义圆形按钮样式
    圆形按钮有很多种实现方式,例如第一种方式在样式中用Ellipse画一个圆形,宽度和高度一致。第二种方式用Border设置Width,Height,CornerRadius一致也可以画圆。第三种方式用Pat......
  • C语言学习笔记(八): 自定义数据类型
    结构体变量什么是结构体C语言允许用户自己建立由不同类型数据组成的组合型的数据结构,它称为结构体结构体的成员可以是任何类型的变量,如整数,字符串,浮点数,其他结构体,指针......
  • Solon2 开发之IoC,九、自定义注解开发汇总
    1、定义构建能力注解,比如@Controller注解类:@Target({ElementType.TYPE})@Retention(RetentionPolicy.RUNTIME)@Documentedpublic@interfaceController{}注解类......