Regex for TailwindCSS + Gomponents

tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  // Change this to your project source folder
  content: ['./web/**/*.go'],
  plugins: [],
  theme: {
    extend: {},
  }
}

vscode-settings.json

{
  // Tailwind CSS + Gomponents
  // It can handle single and multiple lines inside the matches
  // It can handle double quotes (") and backticks (`)
  "tailwindCSS.includeLanguages": {
    "go": "go",
  },
  "tailwindCSS.experimental.classRegex": [
    ["Class\\(([^)]*)\\)", "[\"`]([^\"`]*)[\"`]"], // Class("...") or Class(`...`)
    ["Classes\\(([^)]*)\\)", "[\"`]([^\"`]*)[\"`]"], // Classes("...") or Classes(`...`)
    ["Class\\{([^)]*)\\}", "[\"`]([^\"`]*)[\"`]"], // Class{"..."} or Class{`...`}
    ["Classes\\{([^)]*)\\}", "[\"`]([^\"`]*)[\"`]"], // Classes{"..."} or Classes{`...`}
    ["Class:\\s*[\"`]([^\"`]*)[\"`]"], // Class: "..." or Class: `...`
    ["Classes:\\s*[\"`]([^\"`]*)[\"`]"], // Classes: "..." or Classes: `...`
  ],
}

Nice! This also appears to work for the IntelliJ/GoLand plugin.

"experimental": {
    "configFile": null,
    "classRegex": [
      ["Class\\(([^)]*)\\)", "[\"`]([^\"`]*)[\"`]"], 
      ["Classes\\(([^)]*)\\)", "[\"`]([^\"`]*)[\"`]"], 
      ["Class\\{([^)]*)\\}", "[\"`]([^\"`]*)[\"`]"],
      ["Classes\\{([^)]*)\\}", "[\"`]([^\"`]*)[\"`]"], 
      ["Class:\\s*[\"`]([^\"`]*)[\"`]"],
      ["Classes:\\s*[\"`]([^\"`]*)[\"`]"]
    ]
  }

Here's my whole current config for GoLand, going to Settings -> Languages & Frameworks -> Style Sheets -> TailwindCSS:

{
  "includeLanguages": {
    "ftl": "html",
    "jinja": "html",
    "jinja2": "html",
    "smarty": "html",
    "tmpl": "gohtml",
    "cshtml": "html",
    "vbhtml": "html",
    "razor": "html",
    "go": "html"
  },
  "files": {
    "exclude": [
      "**/.git/**",
      "**/node_modules/**",
      "**/.hg/**",
      "**/.svn/**"
    ]
  },
  "emmetCompletions": false,
  "classAttributes": ["class", "className", "ngClass"],
  "colorDecorators": false,
  "showPixelEquivalents": true,
  "rootFontSize": 16,
  "hovers": true,
  "suggestions": true,
  "codeActions": true,
  "validate": true,
  "lint": {
    "invalidScreen": "error",
    "invalidVariant": "error",
    "invalidTailwindDirective": "error",
    "invalidApply": "error",
    "invalidConfigPath": "error",
    "cssConflict": "warning",
    "recommendedVariantOrder": "warning"
  },
  "experimental": {
    "configFile": null,
    "classRegex": [
      ["Class(?:es)?[({]([^)}]*)[)}]", "[\"`]([^\"`]*)[\"`]"]
    ]
  }
}

Note that I had to install TailwindCSS through npm for this to work, the Tailwind CLI doesn't seem to be enough:

npm install -D tailwindcss

I got it working in GoLand without installing node dependencies with this little hack: https://youtrack.jetbrains.com/issue/WEB-55647/Support-Tailwind-css-autocompletion-using-standalone-tailwind-CLI#focus=Comments-27-10957961.0-0