自定义vscode主题需创建或修改颜色主题文件，通过tokenColors设置语法高亮作用域样式，如字符串、注释等，并在colors中配置编辑器ui颜色，最后用内置工具调试并发布。
想要让 VSCode 的代码高亮更符合你的审美或提升可读性，完全可以自定义主题。VSCode 支持通过配置 color tokens 和 textmate rules 来精细控制每种语法元素的颜色和样式，比如关键字、字符串、注释等。
1. 创建自定义颜色主题
VSCode 允许你从头创建一个主题，或者基于现有主题修改：
- 打开命令面板（Ctrl+Shift+P），输入“Developer: Generate Color Theme From Current Settings”可导出现有配色。
- 或者运行“Preferences: Create New Color Theme”，选择“New Color Theme”来引导生成一个新主题模板。
- VSCode 会生成一个 themes/your-theme-name-color-theme.json 文件，里面包含颜色定义。
2. 修改语法高亮规则（TextMate Grammar）
语法高亮的核心是 TextMate 语法规则，它通过正则匹配为代码片段打上“作用域（scope）”标签，然后主题根据这些标签着色。
- 使用“Developer: Inspect Editor Tokens and Scopes”工具，鼠标悬停在代码上，查看当前文本的 scope 名称（如 String.quoted.double.js）。
- 在主题文件的 tokenColors 数组中添加规则，例如：
{ "name": "String literals", "scope": "string", "settings": { "foreground": "#E6DB74", "fontStyle": "italic" } }
你可以为不同语言设置特定作用域，比如 comment.line.double-slash.ts 单独设置 typescript 注释样式。
3. 自定义编辑器整体颜色
除了语法，还可以调整编辑器 UI 颜色，比如背景、边栏、状态栏等，在主题文件的 colors 字段中设置：
"colors": { "editor.background": "#1e1e1e", "editor.foreground": "#CCCCCC", "editor.lineHighlightBackground": "#2D2D2D", "editorCursor.foreground": "#FFFFFF" }
这些颜色会影响整个编辑环境，配合语法高亮达到统一视觉效果。
4. 测试与发布
保存主题文件后，重新加载窗口即可在“Preferences: Color Theme”中切换测试。
- 不断用“Inspect Tokens”工具验证高亮是否生效。
- 确认无误后，可以将主题打包为扩展（extension），发布到 VSCode Marketplace 或本地分享。
基本上就这些。不复杂但容易忽略细节，关键是掌握作用域识别和配色逻辑。调试时多用内置的检查工具，能省很多时间。