Color Highlight 插件不工作主因是 VSCode 内置的 editor.colorDecorators 设置被关闭；需检查全局及工作区 settings.json 中该值为 true，且远程开发时须在远程端启用；函数式颜色和 CSS 变量需手动配置或换用 Colorize 插件。
Color Highlight 插件不工作？先查 editor.colorDecorators
插件本身不控制色块是否显示，真正起作用的是 VSCode 内置的 editor.colorDecorators 设置。关掉它，Color Highlight 再怎么装也看不到色块。
常见误判是“插件没生效”，实际是这个总开关被手动关了：
- 打开设置（
Cmd + ,或Ctrl + ,），搜索colorDecorators，确认Editor > Color Decorators已勾选（对应 JSON 是"editor.colorDecorators": true） - 检查工作区设置：
.vscode/settings.json里有没有"editor.colorDecorators": false——它会覆盖全局设置 - 用远程开发（SSH/Containers）时，该设置必须在远程端生效，本地设了无效
rgb()、hsl()、var(--color) 不渲染？不是 bug，是设计限制
Color Highlight 默认只识别字面量：十六进制（#fff、#ffffff）、预定义色名（red、transparent）。函数式写法和变量无法静态解析。
想让 rgb(255, 0, 0) 或 hsl(0, 100%, 50%) 渲染，得手动加规则：
- 在
settings.json中配置colorHighlight.customColors，例如：{"pattern": "rgb\(\d+,\s*\d+,\s*\d+\)", "color": "$0"} - 更简单的方式是换用
Colorize插件（原生支持函数式） -
var(--primary)类 CSS 变量永远无法被静态分析，任何插件都做不到实时映射，别浪费时间调试
javascript 或 vue 文件里颜色不亮？语言支持要显式开启
插件默认只对 css、scss、html 等语言启用。JS/TS 字符串里的颜色（如 style.backgroundColor = "#00ff00"）默认不扫描。
需在 settings.json 中显式加入语言 ID：
"colorHighlight.languages": ["css", "scss", "html", "javascript", "typescript", "vue"]- 注意误标干扰：比如日志字符串
console.log("#ff0000")也会被高亮，可配合colorHighlight.exclude排除特定路径或模式 - 确保文件语言模式正确：右下角状态栏显示
JavaScript而非Plain Text；若为Plain Text，点击切换
色块太浅/太重？调 colorHighlight.defaultAlpha 或 colorHighlight.border
插件默认用半透明叠加（如 rgba(0, 255, 0, 0.2)），在浅色主题下易被淹没，在深色主题下可能过重。
这不是 bug，是留出的自定义入口：
- 全局调整透明度：
"colorHighlight.defaultAlpha": 0.4 - 为特定格式单独控制，用
colorHighlight.customColors配置数组，例如：{"pattern": "#[0-9a-fA-F]{3,6}", "color": "rgba(0, 0, 0, 0.1)"} - 边框可启用：
"colorHighlight.border": true，提升浅色背景下的辨识度
真正难处理的是跨文件颜色变量映射和运行时计算值——这类问题没有通用解，得靠人工约定或工具链集成，别指望一个轻量插件搞定。
