color highlight 不解析配色文件，仅渲染编辑器中写死的颜色字面量；需手动在 settings.json 中添加 json、javascript 等语言支持，并注意变量、动态值及跨文件引用均不被识别。
Color Highlight 插件本身不“解析”配色文件，它只在编辑器中渲染已写死的颜色字面量；如果你的配色定义在 JSON、JS 或 CSS 变量里，它默认看不到——这不是插件失效，是设计边界。
为什么配色文件里的 #ff6b6b 没色块？
常见于 colors.json、theme.js 或 variables.css 这类非标准样式文件。Color Highlight 默认只启用对 css、scss、html 等语言的支持，其他文件类型不会触发颜色识别。
- 检查当前文件右下角语言模式是否为
JSON或JavaScript（不是CSS） - 打开设置（
Cmd+,或Ctrl+,），搜索colorHighlight.languages - 点击
Edit in settings.json，把对应语言加进去，例如："colorHighlight.languages": ["css", "scss", "json", "javascript"]
- 注意：加了
json后，仅对形如"primary": "#ff6b6b"这种键值对生效；嵌套结构如"colors": { "bg": "#000" }也支持，但带引号的字符串（"#ff6b6b"单独一行）不一定被识别
var(--primary) 和 color-mix() 能不能高亮？
能，但要分情况：
-
var(--primary)：默认不渲染色块，除非你开启colorHighlight.colorizeVariables并配合colorHighlight.customColors显式声明变量值 -
color-mix(in srgb, red 50%, blue 50%)：新版 Color Highlight（v2.8+）原生支持 CSS Color 4 函数，只要语法合法且上下文是 CSS 文件，就会解析并渲染结果色 -
rgb(255, 107, 53)、hsl(0, 100%, 50%)：默认支持，但要求括号内无换行、无多余空格（比如rgb(255\n,107,53)就会漏掉） -
rgba(0,0,0,0.5)：支持，但 alpha 值必须是小数或百分比，rgba(0,0,0,50%)也行
配色文件用 JS 导出，export const colors = { ... } 怎么办？
这是最常踩坑的场景：Color Highlight 默认不扫描 JS 字符串里的颜色值，哪怕它写在模板字面量或对象字面量里。
- 必须确保
colorHighlight.languages包含javascript或typescript - 颜色值需以标准格式出现，例如：
export const colors = {<br> primary: "#ff6b6b",<br> bg: "rgb(255, 255, 255)"<br>}; - 以下写法不会被识别：
bg: process.env.NODE_ENV === "dev" ? "#000" : "#fff"
（运行时分支）、bg: `#${Math.random().toString(16).slice(-6)}`（动态拼接） - 如果用了 CSS-in-JS 库（如
styled-components），需额外配置colorHighlight.customLanguages并写正则匹配模板字符串内容
真正容易被忽略的是：Color Highlight 不做跨文件推导，也不读取 import 链。你在 colors.ts 里定义了 export const PRIMARY = "#ff6b6b"，然后在 Button.tsx 里写 color: PRIMARY，后者永远不会有色块——它只认字面量，不认变量引用。
