Color Highlight 插件不生效需检查 editor.colorDecorators 是否启用；仅支持十六进制和颜色名，不解析 rgb()/hsl()/var()；JS/TS 字符串需手动扩展语言支持；背景过浅可调 colorHighlight.defaultAlpha。
Color Highlight 插件不生效？检查 editor.colorDecorators 是否启用
插件本身不控制颜色装饰的开关，VSCode 内置的 editor.colorDecorators 设置才是关键。默认开启，但被手动关掉后，插件再怎么装也看不到任何背景色。
- 打开设置（
Ctrl+,或Cmd+,），搜color decorators - 确保
Editor > Color Decorators复选框已勾选（对应配置项为"editor.colorDecorators": true） - 如果用的是 workspace 设置，确认没在
.vscode/settings.json里写"editor.colorDecorators": false
为什么 CSS 里 #ff0 能高亮，但 rgb(255, 0, 0) 不行？
Color Highlight 默认只识别基础颜色语法：十六进制（#fff、#ffffff）、预定义色名（red、transparent），不解析函数式颜色（rgb()、hsl()、var(--color)）——这是设计限制，不是 bug。
- 想支持
rgb()和hsl()，需在设置中启用colorHighlight.languages对应语言的扩展规则，并添加rgb、hsl到colorHighlight.customColors - 更简单的方式是换用
Colorize插件（它原生支持函数式颜色），但注意两者不兼容，要禁用 Color Highlight 再装 -
var(--primary)类变量永远无法被静态分析，别指望任何插件能实时渲染它
JS/TS 文件里写 style.backgroundColor = "#00ff00" 没反应？
Color Highlight 默认只激活在 css、scss、less 等样式类语言中。JS/TS 字符串里的颜色值属于“非上下文感知”场景，插件默认不扫描。
- 可手动在
settings.json中扩展支持语言："colorHighlight.languages": [ "css", "scss", "javascript", "typescript" ]
- 但要注意：JS 字符串中颜色可能只是普通文本（比如日志内容），误标会干扰阅读；建议仅在真实 UI 项目中开启，并搭配
colorHighlight.occurrencesInStrings控制是否匹配字符串内内容 - 若开启后性能变卡（尤其大文件），说明插件在反复正则扫描字符串，此时应回退到仅样式文件生效
颜色背景太浅看不清？调整 colorHighlight.customColors 的透明度
插件默认用半透明叠加（如 rgba(0, 255, 0, 0.2)），在浅色主题下容易被淹没，在深色主题下又可能过重。这不是 bug，是故意留出的自定义入口。
- 在
settings.json中添加："colorHighlight.customColors": [ { "color": "#ff0000", "backgroundColor": "rgba(255, 0, 0, 0.3)" } ] - 实际更推荐全局改默认 alpha 值：搜索
colorHighlight.defaultAlpha，设为0.4～0.6（数值越大越不透明） - 注意：修改后需重启编辑器或重载窗口（
Ctrl+Shift+P→Developer: Reload Window）才生效
真正麻烦的是混合主题 + 多层嵌套字符串 + 自定义 CSS 变量的场景——这时候颜色预览本身就成了干扰项，关掉比调参更实在。
