\n\nAm I doing something wrong? Or is TS support for variants just not completed yet?\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3169,3170,3173],{"name":3140,"color":3141},{"name":3171,"color":3172},"needs reproduction","CB47CF",{"name":3158,"color":3159},4046,"provide a custom TS-safe custom variant","2025-05-23T13:22:19Z","https://github.com/nuxt/ui/issues/4046",0.6605988,{"description":3180,"labels":3181,"number":3189,"owner":3146,"repository":3147,"state":3161,"title":3190,"updated_at":3191,"url":3192,"score":3193},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.18.0\n- Nuxt Version: 3.11.2\n- CLI Version: 3.15.0\n- Nitro Version: 2.9.6\n- Package Manager: pnpm@9.5.0\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxtjs/i18n@8.0.0, @nuxt/ui@2.16.0, @nuxtjs/tailwindcss@6.12.0, @pinia/nuxt@0.5.1, @nuxtjs/google-fonts@3.2.0, @nuxtjs/eslint-module@4.1.0, @nuxt/test-utils/module@3.13.1\n- Build Modules: -\n------------------------------\n\n\n\n### Version\n\nv.2.15.0\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-1f7znf?file=app.vue,nuxt.config.ts\n\n### Description\n\nWhen providing custom animations through tailwindcss config, some Nuxt UI animations stop working. I have provided an example of a `UButton` with `loading` set in the repro link above.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3182,3183,3184,3187],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3185,"color":3186},"closed-by-bot","ededed",{"name":3188,"color":3186},"stale",2732,"Adding custom animations disable Nuxt UI ones","2025-06-18T09:05:37Z","https://github.com/nuxt/ui/issues/2732",0.6634519,{"description":3195,"labels":3196,"number":3201,"owner":3146,"repository":3147,"state":3161,"title":3202,"updated_at":3203,"url":3204,"score":3205},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.13.1\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.8\n- Package Manager: yarn@4.8.1\n- Builder: -\n- User Config: compatibilityDate, imports, components, devtools, modules, css, fonts, ui\n- Runtime Modules: @nuxt/eslint@1.2.0, @nuxt/fonts@0.11.0, @nuxt/image@1.10.0, @nuxt/test-utils@3.17.2, @nuxt/ui@3.0.2\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.2\n\n### Reproduction\n\nhttps://github.com/nuxt/ui/blob/v3/src/theme/button.ts\n\n### Description\n\nI want to customize a button variant by `size`, `trailing` and `square` params. It works, but the types are broken.\n\nThe line in the `compoundVariants`:\n`{ size: 'md', trailing: true, square: false, class: { trailingIcon: '-mr-1' } }`\n\nErrors:\n`Type '{ trailingIcon: string; }' is not assignable to type 'string'`\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3197,3198,3199,3200],{"name":3140,"color":3141},{"name":3158,"color":3159},{"name":3143,"color":3144},{"name":3188,"color":3186},3738,"Incorrect compound button variants types","2025-08-12T11:07:19Z","https://github.com/nuxt/ui/issues/3738",0.6647924,{"description":3207,"labels":3208,"number":3213,"owner":3146,"repository":3147,"state":3161,"title":3214,"updated_at":3215,"url":3216,"score":3217},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.12.0\n- Nuxt Version: 3.15.4\n- CLI Version: 3.21.1\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.15.2\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.12\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/bug-report-ubutton-8st7kw\n\n### Description\n\nWhen I throw an error within the click event of `UButton`, the `NuxtErrorBoundary` component does not catch the error as expected. However, if I use a standard `\u003Cbutton>` tag instead of `UButton`, the error is caught correctly by the NuxtErrorBoundary.\n\n### Additional context\n\n\n\n\n### Logs\n\n```shell-script\n\n```",[3209,3210,3211,3212],{"name":3140,"color":3141},{"name":3158,"color":3159},{"name":3185,"color":3186},{"name":3188,"color":3186},3237,"[UButton] is not working with NuxtErrorBoundary","2025-06-18T09:02:19Z","https://github.com/nuxt/ui/issues/3237",0.66629696,{"description":3219,"labels":3220,"number":3225,"owner":3146,"repository":3147,"state":3161,"title":3226,"updated_at":3227,"url":3228,"score":3229},"### Description\n\nI recently discovered that my custom color palettes were not being used by NuxtUi.\n\nI know there is an issue with `neutral` naming https://github.com/nuxt/ui/issues/3986 but I tried with different variable name (like slate for testing purpose) but everytime NuxtUi use the default Tailwind colors and not my overrided palette.\n\nI don't know if it's a bug or a configuration issue.\n\n```css\n@import 'tailwindcss';\n@import '@nuxt/ui';\n\n@theme {\n --color-neutral-50: #f6f6f6;\n --color-neutral-100: #e7e7e7;\n --color-neutral-200: #d1d1d1;\n --color-neutral-300: #b0b0b0;\n --color-neutral-400: #888888;\n --color-neutral-500: #6d6d6d;\n --color-neutral-600: #5d5d5d;\n --color-neutral-700: #4f4f4f;\n --color-neutral-800: #454545;\n --color-neutral-900: #3d3d3d;\n --color-neutral-950: #121212;\n}\n```\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n // DEFAULT\n primary: 'emerald', // default: green\n secondary: 'blue',\n success: 'green',\n info: 'blue',\n warning: 'yellow',\n error: 'red',\n neutral: 'neutral', // default: slate\n // CUSTOM\n alert: 'amber',\n },\n },\n});\n```\n\nNuxi info output :\n```\n- Operating System: Linux\n- Node Version: v22.14.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.11\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: devtools, typescript, css, compatibilityDate, devServer, vite, runtimeConfig, app, ui, scripts, modules, sentry, sourcemap\n- Runtime Modules: @nuxt/ui@3.0.1, @pinia/nuxt@0.11.0, pinia-plugin-persistedstate/nuxt@4.3.0, @sentry/nuxt/module@9.18.0, @nuxt/scripts@0.11.6, @nuxt/eslint@1.3.1\n- Build Modules: -\n```",[3221,3224],{"name":3222,"color":3223},"question","d876e3",{"name":3158,"color":3159},4144,"How to use overrided tailwind colors","2025-05-13T14:46:54Z","https://github.com/nuxt/ui/issues/4144",0.6684036,{"labels":3231,"number":3238,"owner":3146,"repository":3146,"state":3161,"title":3239,"updated_at":3240,"url":3241,"score":3242},[3232,3235],{"name":3233,"color":3234},"3.x","29bc7f",{"name":3236,"color":3237},"pending triage","E99695",13385,"Cannot use Tailwindcss classes from composables","2023-01-19T16:54:19Z","https://github.com/nuxt/nuxt/issues/13385",0.67102414,{"description":3244,"labels":3245,"number":3249,"owner":3146,"repository":3147,"state":3161,"title":3250,"updated_at":3251,"url":3252,"score":3253},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.16.0\n- Nuxt Version: 3.17.5\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: pnpm@10.12.1\n- Builder: -\n- User Config: modules, devtools, css, content, ui, runtimeConfig, future, compatibilityDate, vite, hooks, dayjs, eslint, pwa, supabase, tiptap\n- Runtime Modules: @nuxt/eslint@1.4.1, @nuxt/ui-pro@3.2.0, @vueuse/nuxt@13.4.0, @nuxt/icon@1.15.0, @nuxt/image@1.10.0, @nuxtjs/supabase@1.5.3, @vite-pwa/nuxt@1.0.4, dayjs-nuxt@2.1.11, nuxt-mcp@0.2.3, @nuxtjs/mdc@0.17.0, nuxt-tiptap-editor@2.3.1, @nuxt/content@3.6.1\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.17.5\n\n### Reproduction\n\nDoesn't need reproduction because it's already happening on the official nuxt ui website.\n\n### Description\n\nUnfortunately, due to the way Tailwind/nuxtUi generates colors, it doesn’t create proper fallback colors. It only outputs the @supports colors, without generating the corresponding fallback with the correct opacity.\n\nHere’s an example using bg-red-500/20:\n\n\u003Cimg width=\"522\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/b618470b-292f-42bf-9f62-a39e418f15df\" />\n\nAnd here’s another example with bg-success/20:\n\n\u003Cimg width=\"520\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/72ca102b-10fa-40ae-aa59-c6f18831d4dd\" />\n\nAs you can see, the fallback color is missing the intended 20% opacity.\n\n### Additional context\n\nI've noticed this Issue when I worked on older browser and the whole page looks odd. I'm looking into the Issue currently and could need an helping and. ",[3246,3247,3248],{"name":3140,"color":3141},{"name":3158,"color":3159},{"name":3143,"color":3144},4432,"Fallback colors are not generated properly for tailwind utilities","2025-07-03T15:25:40Z","https://github.com/nuxt/ui/issues/4432",0.6743501,{"description":3255,"labels":3256,"number":3257,"owner":3146,"repository":3146,"state":3161,"title":3258,"updated_at":3259,"url":3260,"score":3261},"### Environment\n\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v16.18.0`\r\n- Nuxt Version: `3.0.0-rc.11`\r\n- Nitro Version: `0.5.4`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\r\n\r\nAnother PC:\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.17.0`\r\n- Nuxt Version: `3.0.0-rc.11`\r\n- Nitro Version: `0.5.4`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\r\n\n\n### Reproduction\n\nI can't share the link :(\n\n### Describe the bug\n\nI'm getting 500 erro sometimes.\r\n\r\n`[vite-node] [plugin:vite:css] [@tailwind base; @tailwind components; @tailwind utilities; ] /node_modules/@nuxtjs/tailwindcss/dist/runtime/tailwind.css`\r\n\r\n@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n\r\nat /node_modules/@nuxtjs/tailwindcss/dist/runtime/tailwind.css\r\n\r\nConsole: \r\n```\r\n ERROR [postcss] input.slice is not a function \r\n ERROR [postcss] input.slice is not a function \r\n\r\nℹ Vite client warmed up in 2646ms \r\n✔ Nitro built in 265 ms \r\n``` \r\nHow can I fix this?\r\n\n\n### Additional context\n\nScreenshot: https://ibb.co/88S5vtP\n\n### Logs\n\n```shell\nzorin@zorin-pc:~/somewhere $ yarn dev\r\nyarn run v1.22.19\r\n$ nuxt dev\r\nNuxi 3.0.0-rc.11 12:28:33\r\nNuxt 3.0.0-rc.11 with Nitro 0.5.4 12:28:33\r\n 12:28:34\r\n > Local: http://localhost:3000/ \r\n > Network: http://10.0.0.41:3000/\r\n > Network: http://192.168.2.1:3000/\r\n > Network: http://192.168.6.1:3000/\r\n\r\nℹ Using default Tailwind CSS file from runtime/tailwind.css nuxt:tailwindcss 12:28:34\r\n\r\n WARN [kit] [compat] Using extendBuild in Nuxt 3 has no effect. Instead call extendWebpackConfig and extendViteConfig.\r\n\r\n\r\n WARN [kit] [compat] Using extendBuild in Nuxt 3 has no effect. Instead call extendWebpackConfig and extendViteConfig.\r\n\r\nℹ Tailwind Viewer: http://[::]:3000/_tailwind/ nuxt:tailwindcss 12:28:34\r\n\r\n WARN 12:28:35\r\n\r\n\r\n WARN warn - The purge/content options have changed in Tailwind CSS v3.0. 12:28:35\r\n\r\n\r\n WARN warn - Update your configuration file to eliminate this warning. 12:28:35\r\n\r\n\r\n WARN warn - https://tailwindcss.com/docs/upgrade-guide#configure-content-sources 12:28:35\r\n\r\n\r\n ERROR [postcss] input.slice is not a function 12:28:35\r\n\r\n\r\n WARN [@vue/compiler-sfc] defineProps is a compiler macro and no longer needs to be imported. 12:28:36\r\n\r\n\r\n\r\n ERROR [postcss] input.slice is not a function 12:28:37\r\n\r\n\r\n ERROR [postcss] input.slice is not a function 12:28:37\r\n\r\nℹ Vite client warmed up in 2661ms 12:28:37\r\n✔ Nitro built in 303 ms nitro 12:28:38\n```\n",[],15840,"500 Tailwind Error at /node_modules/@nuxtjs/tailwindcss/dist/runtime/tailwind.css","2023-01-19T18:29:36Z","https://github.com/nuxt/nuxt/issues/15840",0.67457104,["Reactive",3263],{},["Set"],["ShallowReactive",3266],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fNkr-_lcAxy0REEb6hCVtXAaAw0DhQ8DTWxo6VJXcrWw":-1},"/nuxt/ui/2860"]