Completions not appearing on my v4 project

[Erghan]

What version of VS Code are you using?

1.98.0

What version of Tailwind CSS IntelliSense are you using?

0.14.8

What version of Tailwind CSS are you using?

4.0.12

What package manager are you using?

npm

What operating system are you using?

macOS

Tailwind config

module.exports = {
  content: [
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};

VS Code settings

{
  "explorer.sortOrder": "type",
  "editor.minimap.enabled": true,
  "editor.renderWhitespace": "all",
  "editor.wordWrap": "on",
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[php]": {
    "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
  },
  "php.validate.executablePath": "/Applications/MAMP/bin/php/php7.4.12/bin/php",
  "files.autoSaveDelay": 3000,
  "editor.tabSize": 2,
  "prettier.tabWidth": 2,
  "CSSNavigation.activeCSSFileExtensions": ["scss", "sass", "less"],
  "workbench.iconTheme": "helium-icon-theme",
  "workbench.tree.indent": 18,
  "[svg]": {
    "editor.defaultFormatter": "jock.svg"
  },
  "files.exclude": {
    "prepros.config": true
  },
  "editor.fontFamily": "Fira Code",
  "editor.fontLigatures": true,
  "accessibility.signalOptions.volume": 0,
  "tailwind-fold.autoFold": true,
  "tailwind-fold.unfoldIfLineSelected": true,
  "files.associations": {
    "*.css": "tailwindcss"
  },

  "editor.quickSuggestions": {
    "strings": true
  },

  "tailwindCSS.includeLanguages": {
    "plaintext": "html"
  }
}

Reproduction URL

N/A

Describe your issue

I am working on a project with Next.js and Tailwind v4.
When I start typing the Tailwind class, I get this error in the dev tool. Autocompletion doesn't work.

[thecrypticace]

I've changed the issue title as this:

[Extension Host] [fetchCompletions] Response status was 402: quota exceeded

Looks to me like its an AI-related extension (e.g. copilot, Claude, etc…) and is unrelated to Tailwind CSS IntelliSense.

Please provide a reproduction of your Tailwind CSS project setup

[RalphAtHamburg]

I have a similar problem with almost the same setup. The completions and the hover-boxes do not work. However, if I delete the node_modules folder and reload the window, everything is fine.

[KostaJovic01]

I am also having trouble getting the autocompletions to work after the upgrade to Tailwindcss V4
However im using both VScode and Webstorm
it seems that the problem is with the language server
https://youtrack.jetbrains.com/issue/WEB-71469/Tailwind-CSS-4-class-completion-doesnt-work-if-Sass-SCSS-file-contains-use-tailwindcss-instead-of-import-tailwindcss

[anym0re94]

I'm not quite sure what caused this, but I might just found the work around (using v0.14.9)

• in the vscode settings, add this
  { "tailwindCSS.experimental.configFile": "tailwind.config.ts" }
• the tailwind.config.{whatever ext}, remove the theme and plugin keys.

***The colors completion still quiet though.

[ViggoV]

In my case completion generally works, but the classes are sorted alphabetically so it is almost worse than nothing.

[rChaoz]

@Erghan hi, I was encountering the same issue and managed to pinpoint it to a removed utiltiy in an @apply, check out #1265 for more details, maybe this helps fix your issue

[ToniIvars]

Hello! I've had the same problem as you for a while but, as @anym0re94 said here,

I'm not quite sure what caused this, but I might just found the work around (using v0.14.9)

* in the vscode settings, add this
  `{ "tailwindCSS.experimental.configFile": "tailwind.config.ts" }`

* the tailwind.config.{whatever ext}, remove the theme and plugin keys.

***The colors completion still quiet though.

the solution for me has been to write { "tailwindCSS.experimental.configFile": "path/to/the/input/css/file" } in the settings of vscode. However, as the issue is with tailwind v4, you don't have a config file but an "input" css file that tailwind uses to compile the final styles. This is the file you have to put in your editor settings.

You will find more information in the extension page (at the end of the page). Hope this helps!

[vinicete]

I just fixed it adding "tailwindCSS.experimental.configFile": "path/to/index.css" on settings.json