如何配置VSCode颜色属性？从零开始打造个性化主题？

本文共计845个文字，预计阅读时间需要4分钟。

VSCode自定义主题并非只是改几个颜色值就能生效的——它需要同时提供colors和tokenColors两个顶层字段，二者缺一不可。否则，整个主题文件将会被默认忽略。

为什么只配 colors 没效果？

很多人新建一个 theme.json，只填了侧边栏、编辑器背景等 UI 色，结果代码语法还是默认蓝黄。这是因为 VSCode 主题系统强制要求双层结构：

• colors 控制 UI 元素：如 sideBar.background、tab.activeBackground，键名必须是官方预定义 color ID（不能自创）
• tokenColors 控制代码着色：是数组，每项含 scope（TextMate 作用域）和 settings（foreground、fontStyle 等）
• 两者缺一，VSCode 直接跳过加载该主题，不报错也不提示

怎么精准拿到 scope？别猜，用内置工具

想改函数名颜色，但不知道该写 support.function 还是 support.function.builtin.js？靠文档查或网上搜效率低还容易错。