必须安装bradlc发布的tailwindcss-intellisense插件（ID：bradlc.vscode-tailwindcss），并开启editor.quickSuggestions.strings、正确配置classRegex及语言模式，否则类名提示、颜色预览等功能失效。
tailwindcss-intellisense插件必须装对，否则快捷键和补全都无效
VSCode里Tailwind类名提示、颜色预览、响应式前缀支持，全靠tailwindcss-intellisense插件驱动。它只认bradlc发布的那个——插件ID是bradlc.vscode-tailwindcss。其他名字带“tailwind”“autocomplete”“class”的扩展，基本不维护、不支持@apply或theme()，还可能干扰补全逻辑。
装完立刻做三件事：
- 卸载所有非bradlc发布的Tailwind相关插件
- 确认扩展详情页显示发布者为
bradlc - 别指望“安装即生效”，后续所有功能都依赖配置是否被正确读取
editor.quickSuggestions.strings必须设为true，否则敲className=""没任何提示
Tailwind类名90%写在字符串里：className="text-lg bg-blue-500"。而VSCode默认关掉字符串内的自动补全——这是最隐蔽、最高频的“没提示”原因。
打开设置（Ctrl+,），搜editor.quickSuggestions，把strings项设为true。这个开关影响全局：JSON键名、正则字面量、甚至{"key": ""}里的key都会受它控制。
立即学习“前端免费学习笔记（深入）”；
改完不用重启VSCode，但当前文件得重新打开，或执行命令Developer: Reload Window。
classRegex不配，cn()、tw``这些封装函数就完全不识别
插件默认只扫描class="xxx"和className="xxx"这种字面量。一旦你用cn()、twMerge()或tw`模板字符串包类名，就得手动告诉插件“从哪儿抽字符串”。
在工作区或用户settings.json的tailwindCSS节点下加这段：
{
"tailwindCSS.experimental.classRegex": [
"className\s*=\s*["'`]([^"'`]*)["'`]",
"class\s*=\s*["'`]([^"'`]*)["'`]",
"cn\(\s*(["'`][^"'`]*?["'`])",
"tw`([^`]*)`"
]
}
注意：括号和引号必须转义；正则必须写在tailwindCSS对象里，不是editor.suggest相关配置；动态拼接如className={`${base} ${active ? 'text-blue' : ''}`}天然不支持补全，插件只解析静态字符串部分。
语言模式不对，补全根本不会启动
插件只在html、typescriptreact、vue、astro等语言模式下激活。右下角状态栏显示的是Plain Text或TypeScript，而不是TypeScript React，补全就压根不触发。
点击右下角语言标识，手动选成TypeScript React（React项目）或Vue（Vue项目）。对非标后缀（比如.page.tsx），在settings.json加映射："files.associations": {"*.page.tsx": "typescriptreact"}。
content路径写错、tailwind.config.js不在根目录、配置里有require('missing-pkg')——这些都会导致插件静默降级为默认配置，你自定义的theme.extend.colors.brand就彻底消失。补全失效时，先看右下角语言模式，再查tailwind.config.js位置和语法，最后翻editor.quickSuggestions.strings开关。这三处卡住，90%的问题就解决了。
