废话不说，直接看VSCode的 settings.json配置, 对应的插件大家自己安装一下
- 主题使用了：Monokai Pro 的filter Spectrum
- 使用了：GlassIt-VSC 透明度插件
- 字体使用了：JetBrains Mono
- 编辑器活动栏图标使用了：Fluent Icnos
- 编辑器图标使用了：VSCode Great Icons
- 动画使用了：VSCode Animations，Apc Customize UI++，cusotm CSS and JS Loader，Fluent UI for VSCode
- 项目图标可以使用（可选）: Bearded Icons
``
js
```{
// 括号匹配颜色
"editor.bracketPairColorization.enabled": false,
// 终端位置
"workbench.panel.defaultLocation": "right",
// 缩略图
"editor.minimap.enabled": false,
// 编辑器行高亮
"editor.renderLineHighlight": "none",
// 编辑器行号
"editor.glyphMargin": false,
// 编辑器折叠
"editor.folding": true,
// 编辑器行高
"editor.lineHeight": 25,
// 编辑器字体大小
"editor.fontSize": 14,
// 编辑器字体
"editor.fontFamily": "JetBrains Mono, Consolas, 'Courier New', monospace",
// 字体间距
"editor.letterSpacing": 0.5,
// 鼠标光标宽度
"editor.cursorWidth": 2,
// 鼠标光标样式
"editor.cursorBlinking": "phase",
// 终端字体
"terminal.integrated.fontFamily": "JetBrains Mono, Consolas, 'Courier New', monospace",
// 终端行高
"terminal.integrated.lineHeight": 1.2,
// 字体连字
"editor.fontLigatures": true,
// 括号匹配颜色
"editor.guides.bracketPairs": "active",
// 括号匹配
"editor.matchBrackets": "near",
// 取消倾斜
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": [
"comment",
"keyword",
"entity.name.function", // 基础函数名
"meta.function", // 函数定义
"meta.method", // 类方法
"support.function", // 内置函数
"storage.type.function", // 函数类型声明
"entity.name.function.arrow", // 箭头函数名 (ES6+)
"meta.arrow.js", // 箭头函数符号 (=>)
"entity.name.function.constructor", // 构造函数
"meta.generic", // 泛型语法
"meta.function-call", // 函数调用表达式
"variable.parameter", // 函数参数
"variable.other.readwrite", // 普通变量
"meta.function.parameters", // 函数参数列表
"storage.modifier.async", // async 关键字
"keyword.control.await" // await 操作符
],
"settings": {
"fontStyle": "" // 确保这里保持空字符串
}
}
]
},
// 主题
"workbench.colorCustomizations": {
"[Monokai Pro (Filter Spectrum)]": {
// ------------------------- 活动栏 -------------------------
// 1. 背景颜色
"activityBar.background": "#000000",
// 2. 活动图标颜色
"activityBar.foreground": "#01c4ad",
// 3. 未活动图标颜色
"activityBar.inactiveForeground": "#5b5b5b",
// 4. 边框颜色
"activityBar.border": "#000000",
// 5. 活动项的背景颜色
"activityBar.activeBackground": "#000000",
// ------------------------- 编辑器 -------------------------
// 1. 背景颜色
"editor.background": "#000000",
// 2. 光标颜色
"editorCursor.foreground": "#049382",
// 3. 行高亮背景颜色
"editor.lineHighlightBackground": "#292828",
// 4. 选中文本的背景颜色
"editor.selectionBackground": "#1f1f1f",
// 5.行号颜色
"editorLineNumber.foreground": "#5b5b5b",
// 6.粘滞滚动的背景颜色
"editorStickyScroll.background": "#1f1f1f",
// ------------------------- 资源管理器 -------------------------
// 1.背景颜色
"sideBar.background": "#000000",
// 2.选中项背景颜色
"list.activeSelectionBackground": "#1f1f1f",
// 3.悬停时的背景颜色
"list.hoverBackground": "#1f1f1f",
// 4.标题颜色
"sideBarTitle.foreground": "#5b5b5b",
// 5.状态栏背景颜色
"statusBar.background": "#000000",
// 6.前景颜色
"statusBar.foreground": "#5b5b5b",
// 7.活动标题颜色
"titleBar.activeBackground": "#000000",
// 8.菜单背景颜色
"menu.background": "#000000",
// 9.输入框背景颜色
"input.background": "#000000",
// 10.编辑器边框颜色
"editorGutter.background": "#000000",
// 11.编辑器组标题背景颜色
"editorGroupHeader.tabsBackground": "#000000",
// 12.编辑器组标题边框颜色
"tab.activeBackground": "#1f1f1f",
// 13.编辑器组标题边框颜色
"tab.border": "#000000",
// 14.编辑器组标题活动前景颜色
"tab.activeForeground": "#ffffff",
// 15.编辑器组标题未活动背景颜色
"tab.inactiveBackground": "#000000",
// 16.滚动条滑块背景颜色
"scrollbarSlider.background": "#1f1f1f",
// 17.终端背景颜色
"terminal.background": "#000000",
// 18.终端前景颜色
"terminal.foreground": "#339933",
// 19.面板标题前景颜色
"panelTitle.activeForeground": "#e2b828",
// 20.面板标题未活动前景颜色
"panelTitle.inactiveForeground": "#cccccc"
},
// 修改配置项名称
"monokai-pro.italic": false // 修改配置项名称
},
// 格式化
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// 背景图片
"backgroundCover.imagePath": "c:\\Users\\Knight\\Pictures\\Camera Roll\\【哲风壁纸】极简主义-简单的背景.png",
// 格式化
"editor.formatOnSave": true,
// css格式化
"[css]": {
"editor.defaultFormatter": "vscode.css-language-features"
},
// 资源管理器删除确认
"explorer.confirmDelete": false,
// 面包屑
"breadcrumbs.enabled": false,
// json格式化
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// 资源管理器拖拽
"explorer.confirmDragAndDrop": false,
// js格式化
"javascript.format.enable": false,
// html格式化
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
// 背景模糊
"backgroundCover.blur": 2,
// 自动对齐
"editor.linkedEditing": true,
// 文件关联
"files.associations": {
"manifest.json": "jsonc",
"pages.json": "jsonc"
},
// 主题
"workbench.colorTheme": "Monokai Pro (Filter Spectrum)",
// vue格式化
"[vue]": {
"editor.defaultFormatter": "Vue.volar"
},
// 启动页
"workbench.startupEditor": "none",
// 背景透明度
"backgroundCover.opacity": 0.1,
// 图标
"workbench.productIconTheme": "fluent-icons",
// 自定义样式
"vscode_custom_css.imports": [],
// 动画
"editor.cursorSmoothCaretAnimation": "on",
// 动画
"animations.CursorAnimation": true,
// 动画
"animations.Install-Method": "Apc Customize UI++",
// 自定义样式
"apc.imports": [
"file:///c:/Users/Knight/.vscode/extensions/brandonkirbyson.vscode-animations-2.0.7/dist/updateHandler.js"
],
// 动画
"animations.UseCursorColorForCursorAnimation": true,
// 图标
"workbench.iconTheme": "bearded-icons",
// 终端字体大小
"terminal.integrated.fontSize": 14,
// 树状结构缩进宽度
"workbench.tree.indent": 10,
// 背景透明度
"glassit.alpha": 255
}