Tailwind CSS IntelliSense色块不显示的主因是tailwindCSS.colorHints未启用或语言模式不匹配：需设"tailwindCSS.colorHints": true，且文件必须识别为HTML/JSX/Vue等支持模式，自定义颜色须在tailwind.config.js中声明，任意值语法如bg-[#6366f1]可预览但不补全。
VSCode 插件本身不直接“配置颜色方案”，真正起作用的是插件触发的语法高亮规则、颜色预览能力，或对 workbench.colorCustomizations / editor.tokenColorCustomizations 的间接影响。装了插件却没效果，90% 是配置没对路或语言模式不匹配。
为什么 Tailwind CSS IntelliSense 的色块不显示？
它依赖两个硬性条件：一是 tailwindCSS.colorHints 必须为 true；二是当前文件必须被识别为 CSS/HTML/JSX/Vue 等支持类名解析的语言模式（不能是 plaintext 或 postcss）。
-
tailwind.config.js中未定义的自定义色值（如bg-brand）不会渲染色块，哪怕你在 HTML 里写了也没用 -
bg-[#6366f1]这种任意值语法能触发预览，但不会出现在补全列表里 - 重启 VS Code 不解决问题，执行
Ctrl+Shift+P → Tailwind CSS: Restart Tailwind CSS Server才有效 - 如果右下角显示
css却仍不生效，检查是否安装了冲突插件（比如老版本的 CSS IntelliSense）
Color Highlight 插件和原生 colorDecorators 冲突吗？
不冲突，但职责不同：原生 editor.colorDecorators 只处理 CSS 文件里的标准颜色字面量（#fff、rgb()、hsl()），而 Color Highlight 能在 JS 字符串、Markdown、甚至 JSON 里高亮颜色——代价是可能误标、拖慢大文件编辑。
- 先确认
"editor.colorDecorators": true在用户设置或工作区设置里没被覆盖为false -
Color Highlight的配置项如colorHighlight.languages需手动添加"javascript"才能在 JS 字符串里生效 - 它无法渲染
var(--primary)或currentColor，这点和原生能力一致
如何让 rgb() 和 hsl() 在 CSS 中显示色块？
VS Code 1.84+ 原生支持，但前提是语言模式必须是 css（不是 postcss、scss 或 vue 模板里的 style 标签，除非你开了 "editor.quickSuggestions": { "strings": true }）。
- 写在
.html的<style>标签里可以，但需确保右下角语言模式是css，不是html -
rgb(0, 128, 255)和hsl(210, 100%, 50%)支持，但rgb(var(--r), var(--g), var(--b))不支持 - 旧版本 VS Code 或某些 SCSS 插件链路断裂时，
rgb()可能失效——换回纯css文件测试即可验证
最常被忽略的点：颜色预览不是“装了插件就自动好”，而是由语言模式 + 设置开关 + 插件能力三者共同决定。哪怕所有配置都对，只要右下角显示的是 plaintext，#3b82f6 就永远不会有小色块。
