直接修改 settings.json 中的 editor.tokencolorcustomizations → textmaterules,按语言后缀(如 keyword.control.js)精准匹配作用域,可分别设置 if 等关键字和 this 等变量颜色,无需插件且实时生效。

直接改默认主题的关键字颜色,不装插件也能做
VSCode 默认主题(如 Dark+ 或 Light+)本身不提供图形化界面让你单独调关键字颜色——它靠的是底层语法着色规则(token color rules),不是“点选修改”。想改 if、return、this 这类关键字颜色,必须手动编辑 settings.json 中的 editor.tokenColorCustomizations,而不是在颜色主题菜单里点几下就能搞定。
- 打开设置:按
Ctrl + ,→ 右上角点「打开设置 (JSON)」图标(那个 `{}`) - 添加或修改
"editor.tokenColorCustomizations"块,里面用"textMateRules"匹配语法作用域 - 别去碰
workbench.colorCustomizations——那是改界面的(侧边栏、状态栏),对代码关键字完全无效 -
this不是关键字(keyword),它是变量(variable),作用域是variable.language,不是keyword;写错范围就不起作用
怎么准确找到你要改的关键字对应的作用域?
靠猜名字大概率失败。VSCode 提供了官方调试工具:Developer: Inspect Editor Tokens and Scopes(开发者:检查编辑器标记和作用域)。光标停在目标词(比如 for 或 async)上,运行这个命令,面板会立刻显示当前 token 的完整作用域链,例如:keyword.control.js 或 storage.type.class.js。
- 作用域越具体,覆盖越精准;写成
keyword会同时影响所有语言的关键字,容易误伤 - JavaScript 的
await是keyword.control.js,而 Python 的await是keyword.control.python,跨语言不通用 - 注释、字符串、数字等也都有各自作用域,可一并定制,但要分开写规则,不能混在一条里
一个能直接粘贴生效的 JSON 示例
以下配置把 JS 中的控制关键字(if、for、return 等)改成青绿色,同时把 this 单独设为紫色——注意两者的 scope 差异:
传媒企业网站系统使用热腾CMS(RTCMS),根据网站板块定制的栏目,如果修改栏目,需要修改模板相应的标签。站点内容均可在后台网站基本设置中添加。全站可生成HTML,安装默认动态浏览。并可以独立设置SEO标题、关键字、描述信息。源码包中带有少量测试数据,安装时可选择演示安装或全新安装。如果全新安装,后台内容充实后,首页才能完全显示出来。(全新安装后可以删除演示数据用到的图片,目录在https://
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "keyword.control.js",
"settings": {
"foreground": "#26c6da"
}
},
{
"scope": "variable.language.js",
"settings": {
"foreground": "#ab47bc"
}
}
]
}
- 颜色值支持
#rrggbb、rgb()、命名色(如red),但推荐用十六进制,兼容性最稳 - 改完保存,不用重启 VSCode,新打开的文件或重载窗口(
Ctrl+Shift+P→Developer: Reload Window)即可看到效果 - 如果某关键字没变色,先确认语言模式是否正确(右下角显示的是
JavaScript而非Plain Text)
装插件反而容易搞乱,除非你真需要可视化编辑
像 Colorize 或 Highlight 这类插件,本质是用正则匹配文本再高亮,跟语法解析无关。它们会覆盖原生 token 颜色、干扰括号匹配、在某些语言(如 TypeScript JSX)中失效,还可能拖慢大文件渲染。真正想稳定改关键字颜色,原生 tokenColorCustomizations 是唯一可靠路径。
最容易被忽略的一点:作用域名带语言后缀(如 .js、.ts、.python)是强制的,删掉就失效;而不同扩展(比如 Prettier、ESLint)不会影响这个配置——它只走 VSCode 内置的 TextMate 语法引擎。









