\r\n```\r\n\r\nhttps://github.com/nuxt-modules/icon/blob/0ae93b806f0633f9ee65599136655c0456ffed95/src/runtime/Icon.vue#L70-L73",[3039],{"name":3040,"color":3041},"question","d876e3",68,"closed","TailwindCSS `hidden` class not hiding `Icon`","2023-08-07T18:00:28Z","https://github.com/nuxt/icon/issues/68",0.6411071,{"description":3049,"labels":3050,"number":3059,"owner":3020,"repository":3060,"state":3043,"title":3061,"updated_at":3062,"url":3063,"score":3064},"### Environment\n\nNuxt project info:\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.20.3\r\n- Nuxt Version: 3.12.4\r\n- CLI Version: 3.12.0\r\n- Nitro Version: 2.9.7\r\n- Package Manager: pnpm@8.15.6\r\n- Builder: -\r\n- User Config: modules, compatibilityDate\r\n- Runtime Modules: @nuxt/ui@2.18.3\r\n- Build Modules: -\r\n------------------------------\n\n### Version\n\nv2.18.0\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-ktbnby?file=README.md,app.vue,assets%2Fcss%2Ftailwind.css\n\n### Description\n\nBefore the `nuxt-icon` rewrite with `nuxt-ui` 2.18.0 you could write following kind of custom css into `assets/css/tailwind.css`:\r\n```\r\n@layer utilities {\r\n .i-lb {\r\n @apply scale-x-[-1];\r\n @apply i-heroicons-light-bulb;\r\n }\r\n}\r\n```\r\n\r\nAfter 2.18.0 this breaks as the `i-heroicons-light-bulb` class does not exist anymore in that context. \n\n### Additional context\n\nThe goal is to create a custom icon (in this case `i-lb`) that uses existing icon but adds something more necessary, like that scale apply as an example.\n\n### Logs\n\n```shell-script\n[plugin:vite:css] [postcss] /home/projects/nuxt-ui/assets/css/tailwind.css:11:5: The `i-heroicons-light-bulb` class does not exist. If `i-heroicons-light-bulb` is a custom class, make sure it is defined within a `@layer` directive.\n```\n",[3051,3054,3057],{"name":3052,"color":3053},"bug","d73a4a",{"name":3055,"color":3056},"closed-by-bot","ededed",{"name":3058,"color":3056},"stale",1998,"ui","Custom CSS rule to apply icon class in tailwind.css not working after 2.18 release","2025-07-30T02:13:39Z","https://github.com/nuxt/ui/issues/1998",0.72044796,{"labels":3066,"number":3073,"owner":3020,"repository":3020,"state":3043,"title":3074,"updated_at":3075,"url":3076,"score":3077},[3067,3070],{"name":3068,"color":3069},"3.x","29bc7f",{"name":3071,"color":3072},"pending triage","E99695",13385,"Cannot use Tailwindcss classes from composables","2023-01-19T16:54:19Z","https://github.com/nuxt/nuxt/issues/13385",0.7265814,{"description":3079,"labels":3080,"number":3086,"owner":3020,"repository":3020,"state":3043,"title":3087,"updated_at":3088,"url":3089,"score":3090},"### Environment\n\nnode: v16.15.1\r\nnuxt: ^3.2.0\r\ntailwindcss: ^6.2.0\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-ky7itr\n\n### Describe the bug\n\nHello team,I want to use the style of tailwindcss: https://tailwindcss.com/docs/gradient-color-stops\r\n\r\nso I wrote this:\r\n\r\nresult:\r\n\r\nIt's right,now I use dynamic class:\r\n\r\nreuslt:\r\n\r\n\r\nIt can be seen from the console that the style is indeed written into the class,so what did I wrong?If you can see right style,please \r\nrestart the project,thanks.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3081,3082,3083],{"name":3068,"color":3069},{"name":3071,"color":3072},{"name":3084,"color":3085},"⛔️ can be closed","484893",19013,"Nuxt3 cannot use tailwindcss in dynamic class","2023-02-14T08:39:44Z","https://github.com/nuxt/nuxt/issues/19013",0.727096,{"labels":3092,"number":3097,"owner":3020,"repository":3020,"state":3043,"title":3098,"updated_at":3099,"url":3100,"score":3101},[3093,3094],{"name":3071,"color":3072},{"name":3095,"color":3096},"2.x","d4c5f9",7197,"purgeCSS ignores tailwind classes in nuxt.config.js (bodyAttr, htmlAttrs)","2023-01-22T15:34:50Z","https://github.com/nuxt/nuxt/issues/7197",0.7289985,{"labels":3103,"number":3108,"owner":3020,"repository":3020,"state":3043,"title":3109,"updated_at":3110,"url":3111,"score":3112},[3104,3107],{"name":3105,"color":3106},"enhancement","8DEF37",{"name":3095,"color":3096},7666,"NuxtLink `inactive-class` attribute","2024-06-14T16:04:23Z","https://github.com/nuxt/nuxt/issues/7666",0.72923017,{"description":3114,"labels":3115,"number":3122,"owner":3020,"repository":3060,"state":3043,"title":3123,"updated_at":3124,"url":3125,"score":3126},"### Environment\n\n- Operating System: Darwin\r\n- Node Version: v20.6.1\r\n- Nuxt Version: 3.13.0\r\n- CLI Version: 3.13.1\r\n- Nitro Version: 2.9.7\r\n- Package Manager: pnpm@8.6.12\r\n- Builder: -\r\n- User Config: compatibilityDate, devtools, modules\r\n- Runtime Modules: @nuxt/ui@2.18.4\r\n- Build Modules: -\n\n### Version\n\n2.18.4\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-rzyn6r?file=assets%2Fcss%2Ftailwind.css\n\n### Description\n\nI tried to use `@apply` in `\u003Cstyle>` block in my vue files. But I got the error that my class does not exists.\r\n```\r\n[vite-node] [plugin:vite:css] [CssSyntaxError] ./app.vue:9:2 : The `bar` class does not exist. If `bar` is a custom class, make sure it is defined within a `@layer` directive.\r\n```\r\nI also tested it without `@nuxt/ui` module but only `@nuxtjs/tailwindcss` module, which works perfectly fine.\r\nI looked for config in nuxt UI document, but didn't find anything that could help fixing this.\n\n### Additional context\n\nHere's one reproduction with only `@nuxtjs/tailwindcss` installed\r\nhttps://stackblitz.com/edit/nuxt-ui-eadnqo?file=nuxt.config.ts\n\n### Logs\n\n_No response_",[3116,3117,3120,3121],{"name":3052,"color":3053},{"name":3118,"color":3119},"triage","ffffff",{"name":3055,"color":3056},{"name":3058,"color":3056},2099,"custom tailwind style in `@layer` directive cannot be used within `\u003Cstyle>` block","2025-06-18T09:06:17Z","https://github.com/nuxt/ui/issues/2099",0.74471164,{"labels":3128,"number":3131,"owner":3020,"repository":3020,"state":3043,"title":3132,"updated_at":3133,"url":3134,"score":3135},[3129,3130],{"name":3071,"color":3072},{"name":3095,"color":3096},9451,"Where is tailwind css ?!?","2023-01-22T15:44:58Z","https://github.com/nuxt/nuxt/issues/9451",0.74840546,["Reactive",3137],{},["Set"],["ShallowReactive",3140],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fezYhyvJ7RpKN9Uy5rhYLF2vN4sEYOXLUgNmrC_oLpu8":-1},"/nuxt/icon/108"]