` component.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n[Vue warn]: Invalid prop: custom validator check failed for prop \"color\". \n at \u003CProgress key=1 color=\"neutral\" size=\"xl\" ... > \n```",[2856,2859],{"name":2857,"color":2858},"bug","d73a4a",{"name":2860,"color":2861},"triage","ffffff",3407,"nuxt","ui","open","UProgress missing color type","2025-03-02T15:30:03Z","https://github.com/nuxt/ui/issues/3407",0.6700927,{"description":2871,"labels":2872,"number":2883,"owner":2863,"repository":2863,"state":2865,"title":2884,"updated_at":2885,"url":2886,"score":2887},"### Environment\n\n------------------------------\n- Operating System: Windows_NT\n- Node Version: v22.11.0\n- Nuxt Version: 3.15.0\n- CLI Version: 3.17.2\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: default\n- Runtime Modules: -\n- Build Modules: -\n------------------------------\n\n### Reproduction\n\nhttps://stackblitz.com/~/github.com/igrdi/nuxt-generate-css-duplicates\n\n### Describe the bug\n\nIt adds `\u003Clink>` with the same styles as the inlined one:\n\n1. Run `npm run generate`\n2. Check `/.output/public/index.html` lines 3 and 4: inline styles and `/.output/public/_nuxt/entry.***.css `\n\n\n\n\n\n### Additional context\n\nPlease also check nuxt.config.ts:\n\n```\n// https://nuxt.com/docs/api/configuration/nuxt-config\nexport default defineNuxtConfig({\n compatibilityDate: '2024-11-01',\n devtools: { enabled: true },\n ssr: true,\n features: {\n inlineStyles: (id) => !!id && id.includes('.vue'),\n },\n});\n```\n\nProbably related to the issue: https://github.com/nuxt/nuxt/issues/21821\n@danielroe, FYI\n\n\n### Logs\n\n```shell-script\nnpm run generate\n```",[2873,2876,2877,2880],{"name":2874,"color":2875},"good first issue","fbca04",{"name":2857,"color":2858},{"name":2878,"color":2879},"馃敤 p3-minor","FBCA04",{"name":2881,"color":2882},"inline styles","68AF97",30435,"Nuxt Generate: css duplication issue","2025-02-22T20:48:08Z","https://github.com/nuxt/nuxt/issues/30435",0.6742833,{"description":2889,"labels":2890,"number":2896,"owner":2863,"repository":2864,"state":2897,"title":2898,"updated_at":2899,"url":2900,"score":2901},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v22.11.0`\n- Nuxt Version: `3.17.0`\n- CLI Version: `3.25.0`\n- Nitro Version: `2.11.11`\n- Package Manager: `pnpm@10.4.0`\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.1.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/modern-dust-h3lryc\n\n### Description\n\nHey, after upgrading to latest `@nuxt/ui`, custom Nuxt UI variable overrides stopped working. Looks like the correct colors are not generating.\n\nThis has worked in the previous versions:\n\n```\n:root {\n --ui-bg-elevated: var(--ui-color-neutral-500);\n}\n\nmain {\n --ui-bg-elevated: var(--color-white);\n}\n\n// Should have color --ui-color-neutral-500 with 0.5 opacity - CORRECT\n\u003Cdiv class=\"p-8 flex items-center gap-2 bg-elevated/50\">\n\u003C/div>\n\n// Should have color --color-white with 0.5 opacity - NOT WORKING - has colors from :root\n\u003Cmain class=\"p-8 flex items-center gap-2 bg-elevated/50\">\n\u003C/main>\n```\n\nCurrently, the variables in main have no effect on the sites.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2891,2892,2895],{"name":2857,"color":2858},{"name":2893,"color":2894},"v3","49DCB8",{"name":2860,"color":2861},4018,"closed","Overriding root variables stopped working in 3.1.0","2025-04-29T12:40:17Z","https://github.com/nuxt/ui/issues/4018",0.63274276,{"description":2903,"labels":2904,"number":2910,"owner":2863,"repository":2864,"state":2897,"title":2911,"updated_at":2912,"url":2913,"score":2914},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.9.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.16.0\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.8.3\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.2, @nuxtjs/seo@2.0.2, @nuxtjs/plausible@1.2.0\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.9\n\n### Reproduction\n\nOn a brand new project:\n\n```\nnpx nuxi@latest init my-app\ncd my-app\nnpm install @nuxt/ui@next\n```\n\nThen\n/app/app.vue\n```vue\n\u003Ctemplate>\n\t\u003CNuxtLayout>\n\t\t\u003CNuxtPage />\n\t\u003C/NuxtLayout>\n\u003C/template>\n```\n\nnuxt.config.ts\n```js\n// https://nuxt.com/docs/api/configuration/nuxt-config\nexport default defineNuxtConfig({\n\tcompatibilityDate: \"2024-11-01\",\n modules: ['@nuxt/ui', '@nuxt/eslint', '@nuxtjs/seo'],\n css: ['~/assets/css/main.css'],\n\n\tdevtools: { enabled: true },\n\tfuture: {\n\t\tcompatibilityVersion: 4,\n\t},\n\tui: {\n // error here\n\t\tcolorMode: false,\n\t},\n});\n\n```\n\n### Description\n\nWhen changing the ui.colorMode to false AND using the `pages` folder, it crashes the whole app (error below).\n\n\n```\n500\n[vite-node] [plugin:nuxt:imports-transform] [VITE_ERROR] /@fs/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?macro=true\n\n/* Injection by vite-plugin-vue-inspector Start */\nimport { createVNode as __createVNode } from 'vue'\nfunction _interopVNode(vnode) {\n if (vnode && vnode.props && 'data-v-inspector' in vnode.props) {\n const data = vnode.props['data-v-inspector']\n delete vnode.props['data-v-inspector']\n Object.defineProperty(vnode.props, '__v_inspector', { value: data, enumerable: false })\n }\n return vnode\n}\nfunction _createVNode(...args) { return _interopVNode(__createVNode(...args)) }\n/* Injection by vite-plugin-vue-inspector End */\nimport { defineComponent as _defineComponent } from \"vue\";\nimport { onUnmounted, onMounted, reactive } from \"vue\";\nimport { pascalCase } from \"scule\";\nimport { defineAsyncComponent, useColorMode, useRoute } from \"#imports\";\nconst _sfc_main = /* @__PURE__ */ _defineComponent({\n __name: \"DevtoolsRenderer\",\n setup(__props, { expose: __expose }) {\n __expose();\n const route = useRoute();\n const component = route.query?.example ? defineAsyncComponent(() => import(`./examples/${route.query.example}.vue`)) : route.params?.slug && defineAsyncComponent(() => import(`../../runtime/components/${pascalCase(route.params.slug)}.vue`));\n const state = reactive({});\n function onUpdateRenderer(event) {\n state.props = { ...event.data.props };\n state.slots = { ...event.data.slots };\n }\n const colorMode = useColorMode();\n function setColorMode(event) {\n colorMode.preference = event.isDark ? \"dark\" : \"light\";\n }\n onMounted(() => {\n (void 0).parent.addEventListener(\"nuxt-ui-devtools:update-renderer\", onUpdateRenderer);\n (void 0).parent.addEventListener(\"nuxt-ui-devtools:set-color-mode\", setColorMode);\n });\n onUnmounted(() => {\n (void 0).parent.removeEventListener(\"nuxt-ui-devtools:update-renderer\", onUpdateRenderer);\n (void 0).parent.removeEventListener(\"nuxt-ui-devtools:set-color-mode\", setColorMode);\n });\n onMounted(async () => {\n const event = new Event(\"nuxt-ui-devtools:component-loaded\");\n (void 0).parent.dispatchEvent(event);\n });\n onMounted(() => {\n if (!route.query?.example) return;\n });\n const __returned__ = { route, component, state, onUpdateRenderer, colorMode, setColorMode };\n Object.defineProperty(__returned__, \"__isScriptSetup\", { enumerable: false, value: true });\n return __returned__;\n }\n});\nimport { resolveComponent as _resolveComponent, resolveDynamicComponent as _resolveDynamicComponent, mergeProps as _mergeProps, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode } from \"vue\";\nimport { ssrRenderVNode as _ssrRenderVNode, ssrRenderComponent as _ssrRenderComponent, ssrRenderAttrs as _ssrRenderAttrs } from \"vue/server-renderer\";\nfunction _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {\n const _component_UApp = _resolveComponent(\"UApp\");\n _push(`\u003Cdiv${_ssrRenderAttrs(_mergeProps({\n id: \"ui-devtools-renderer\",\n class: \"nuxt-ui-component-renderer\",\n \"data-v-inspector\": \"../node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue:44:3\"\n }, _attrs))}>`);\n _push(_ssrRenderComponent(_component_UApp, { toaster: null }, {\n default: _withCtx((_, _push2, _parent2, _scopeId) => {\n if (_push2) {\n if ($setup.component) {\n _ssrRenderVNode(_push2, _createVNode(_resolveDynamicComponent($setup.component), _mergeProps($setup.state.props, {\n class: $setup.state?.slots?.base,\n ui: $setup.state.slots\n }), null), _parent2, _scopeId);\n } else {\n _push2(`\u003C!---->`);\n }\n } else {\n return [\n $setup.component ? (_openBlock(), _createBlock(_resolveDynamicComponent($setup.component), _mergeProps({ key: 0 }, $setup.state.props, {\n class: $setup.state?.slots?.base,\n ui: $setup.state.slots\n }), null, 16, [\"class\", \"ui\"])) : _createCommentVNode(\"v-if\", true)\n ];\n }\n }),\n _: 1\n /* STABLE */\n }, _parent));\n _push(`\u003C/div>`);\n}\nimport \"/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?vue&type=style&index=0&lang.css\";\nimport { useSSRContext as __vite_useSSRContext } from \"vue\";\nconst _sfc_setup = _sfc_main.setup;\n_sfc_main.setup = (props, ctx) => {\n const ssrContext = __vite_useSSRContext();\n (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add(\"../../node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue\");\n return _sfc_setup ? _sfc_setup(props, ctx) : void 0;\n};\nimport _export_sfc from \"\\0plugin-vue:export-helper\";\nexport default /* @__PURE__ */ _export_sfc(_sfc_main, [[\"ssrRender\", _sfc_ssrRender], [\"__file\", \"/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue\"]]);\n\nat /@fs/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?macro=true\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2905,2906,2909],{"name":2857,"color":2858},{"name":2907,"color":2908},"duplicate","cfd3d7",{"name":2893,"color":2894},2823,"`colorMode: false` + /pages/ crash the app","2024-12-03T09:33:17Z","https://github.com/nuxt/ui/issues/2823",0.64763016,{"description":2916,"labels":2917,"number":2924,"owner":2863,"repository":2863,"state":2897,"title":2925,"updated_at":2926,"url":2927,"score":2928},"### Environment\n\n- Operating System: Windows_NT\r\n- Node Version: v22.1.0\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: npm@10.7.0\r\n- Builder: -\r\n- User Config: devtools, ssr, modules, alias, colorMode, vuefire\r\n- Runtime Modules: @nuxtjs/tailwindcss@6.12.0, shadcn-nuxt@0.10.4, nuxt-vuefire@1.0.2, @vueuse/nuxt@10.9.0, @pinia/nuxt@0.5.1, @nuxtjs/color-mode@3.4.1\r\n- Build Modules: -\n\n### Reproduction\n\nAny project\n\n### Describe the bug\n\nWhen saving changes in HTML/template the website updates.\r\nWhen saving changes in Javascript/script the website updates.\r\nWhen saving changes in CSS the website **does not** updates.\r\nA manual refresh is necessary, or adding a space in the script part.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2918,2921],{"name":2919,"color":2920},"3.x","29bc7f",{"name":2922,"color":2923},"pending triage","E99695",27769,"Nuxt doesn't update when making CSS changes","2024-06-21T17:55:28Z","https://github.com/nuxt/nuxt/issues/27769",0.65821856,{"description":2930,"labels":2931,"number":2934,"owner":2863,"repository":2863,"state":2897,"title":2935,"updated_at":2936,"url":2937,"score":2938},"### Environment\n\n- Operating System: Darwin\r\n- Node Version: v16.18.1\r\n- Nuxt Version: 3.6.1\r\n- Nitro Version: 2.5.2\r\n- Package Manager: npm@8.19.2\r\n- Builder: vite\r\n- User Config: build, routeRules, runtimeConfig, modules, i18n, css, plugins, devtools, eslint, vite, nitro, sourcemap, typescript\r\n- Runtime Modules: @nuxtjs/eslint-module@4.1.0, @nuxtjs/i18n@8.0.0-beta.12, @bootstrap-vue-next/nuxt@0.1.2, nuxt-jsonld@2.0.8\r\n- Build Modules: -\n\n### Reproduction\n\nI tried to make a reproduction in the stackblitz but somehow it seemed to work there. I am hoping then that maybe you can at least point me to the right direction and I can either find out the cause of this issue or at least find a way to reproduce it. Here are at least some tiny details:\r\n\r\nCSS config in nuxt.config.ts:\r\n\r\n`css: ['vue-final-modal/style.css', '~/assets/css/main.scss'],`\r\n\r\nmain.scss file includes import of bootstrap-vue-next and some separate files like e.g. variables.scss.\n\n### Describe the bug\n\nAfter updating Nuxt to version 3.6, the styles in our app are broken which forces us into staying at version 3.5. When opening the built output, the styles are not loaded. Styles from within pages and components are loaded fine but not those imported via css config prop in nuxt.config.ts.\r\n\r\nThere is also no error or warning when running the build or preview command. The strange thing also is that the styles are there when running the dev command.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2932,2933],{"name":2919,"color":2920},{"name":2922,"color":2923},21911,"Styles set in nuxt.config.ts css prop are not part of the build","2023-07-03T09:47:55Z","https://github.com/nuxt/nuxt/issues/21911",0.661754,{"description":2940,"labels":2941,"number":2944,"owner":2863,"repository":2864,"state":2897,"title":2945,"updated_at":2946,"url":2947,"score":2948},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v22.12.0`\n- Nuxt Vesion: `3.17.1`\n- Nitro version: `2.11.11`\n- Package Manager: `pnpm@10.8.0`\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.1.0\n\n### Reproduction\n\nhttps://github.com/rudrokhanpro/nuxt-ui-tailwind-in-layers-bug\n\n### Description\n\nHello!\nI have encountered a bug affecting TailwindCSS colors in Nuxt Layers.\nI have attached a repo that mimics a project I'm working on.\n\nThere is a first root Nuxt app with NuxtUI called `zero`.\nThere is also a second Nuxt app that `extends: [\"../zero\"]`.\nFinally, there is a third and last Nuxt app that `extends: [\"../one\"]`.\n\nIf we run the `one` project, we can access [`/one`](http://localhost:3000/one), a page that displays components both from the `zero` and `one` projects. \nIf we run the `two` project, we can access [`/two`](http://localhost:3000/two), a page that displays components both from the `zero`, `one` and `two` projects.\n\nYou will notice that the page seems \"empty\" but in reality there are button whose styles are not being set correctly. It seems that it only affects colors because if we inspect the elements we can see that the padding and some hover styles are being applied correctly.\n\n\n\nTo fix this issue, I had to safelist all colors in the root project:\n\n```css\n/* assets/css/main.css */\n@source inline(\"{hover:,disabled:,focus:,}bg-{red,orange,amber,yellow,lime,green,emerald,teal,cyan,sky,blue,indigo,violet,purple,fuchsia,pink,rose,slate,gray,zinc,neutral,stone}-{50,{100..900..100},950}\");\n```\n\nAnd we get the following result:\n\n\n\n### Additional context\n\nI have been migrating and updating my project to Nuxt UI v3 since it was in alpha and it has been a great experience thanks to the contributors of this repository. \n\nThis bug was introduced with Tailwind v4.0.8. I checked every single release and it seems related to the TailwindCSS import and `@theme static {}`\n\n### Logs\n\n```shell-script\n\n```",[2942,2943],{"name":2857,"color":2858},{"name":2893,"color":2894},4049,"Tailwind colors not working in Nuxt Layers","2025-05-19T10:29:55Z","https://github.com/nuxt/ui/issues/4049",0.66439146,{"description":2950,"labels":2951,"number":2958,"owner":2863,"repository":2863,"state":2897,"title":2959,"updated_at":2960,"url":2961,"score":2962},"### Environment\n\nCHILD:\r\n- Operating System: `Darwin`\r\n- Node Version: `v14.21.1`\r\n- Nuxt Version: `3.0.0`\r\n- Nitro Version: `1.0.0`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `vite`\r\n- User Config: `extends`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\r\nPARENT:\r\n- Operating System: `Darwin`\r\n- Node Version: `v14.21.1`\r\n- Nuxt Version: `3.0.0`\r\n- Nitro Version: `1.0.0`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `vite`\r\n- User Config: `modules`\r\n- Runtime Modules: `@vueuse/nuxt@9.11.0`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-nzvnvt?file=project/nuxt.config.ts\n\n### Describe the bug\n\nI'm trying to use `extends` to auto import components, modules, composables etc. from another nuxt project in a different directory, however, when the project I'm extending includes a nuxt module module, I get an error that it could not find the module and the build fails.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2952,2953,2954,2955],{"name":2919,"color":2920},{"name":2857,"color":2858},{"name":2878,"color":2879},{"name":2956,"color":2957},"layers","006B75",18369,"Using `extends` on a project with nuxt modules causes an error","2024-05-24T10:17:36Z","https://github.com/nuxt/nuxt/issues/18369",0.66513366,{"description":2964,"labels":2965,"number":2968,"owner":2863,"repository":2863,"state":2897,"title":2969,"updated_at":2970,"url":2971,"score":2972},"### Environment\n\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v18.12.1`\r\n- Nuxt Version: `3.0.0`\r\n- Nitro Version: `1.0.0`\r\n- Package Manager: `pnpm@7.18.2`\r\n- Builder: `vite`\r\n- User Config: `srcDir`, `imports`, `modules`, `css`, `build`, `pinceau`, `i18n`, `typescript`, `colorMode`, `ignore`, `vite`, `tailwindcss`, `plausible`\r\n- Runtime Modules: `@pinia/nuxt@0.4.6`, `@vueuse/nuxt@9.7.0`, `@nuxtjs/tailwindcss@6.1.3`, `@pinia/nuxt@0.4.6`, `@nuxtjs/i18n@8.0.0-beta.7`, `@nuxtjs/color-mode@3.2.0`, `@huntersofbook/plausible-nuxt@0.5.2`, `@nuxtjs/partytown@1.3.0`, `nuxt-icon@0.1.8`, `pinceau/nuxt`, `@nuxtjs/fontaine@0.2.3`, `nuxt-headlessui@1.0.4`\r\n- Build Modules: `-`\r\n------------------------------\n\n### Reproduction\n\nhttps://github.com/productdevbook/oku-nuxt3-template/tree/bug-nuxt-config\r\n\r\nbrach: bug-nuxt-config\n\n### Describe the bug\n\n\r\nhttps://user-images.githubusercontent.com/38668796/208305787-be4c7c65-820b-4eb5-baaf-9d6295232c31.mp4\r\n\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2966,2967],{"name":2919,"color":2920},{"name":2922,"color":2923},15671,"nuxt config TS errors","2023-01-19T18:29:58Z","https://github.com/nuxt/nuxt/issues/15671",0.6656911,{"description":2974,"labels":2975,"number":2978,"owner":2863,"repository":2863,"state":2897,"title":2979,"updated_at":2980,"url":2981,"score":2982},"### Environment\n\n- Operating System: `Linux`\n- Node Version: `v20.18.1`\n- Nuxt Version: `3.16.0`\n- CLI Version: `3.22.5`\n- Nitro Version: `2.11.6`\n- Package Manager: `pnpm@9.15.4`\n- Builder: `-`\n- User Config: `extends`, `compatibilityDate`, `devtools`, `ssr`, `devServer`, `modules`, `runtimeConfig`, `i18n`\n- Runtime Modules: `@vueuse/nuxt@13.0.0`, `@nuxtjs/i18n@9.3.1`, `@pinia/nuxt@0.10.1`, `@nuxtjs/tailwindcss@6.13.2`, `@primevue/nuxt-module@4.3.1`, `@nuxt/fonts@0.11.0`\n- Build Modules: `-`\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-g35yawsg?file=app.vue\n\n(copied from [the Nuxt docs](https://nuxt.com/docs/getting-started/seo-meta#components))\n\n### Describe the bug\n\nSince the 3.16.0 update, the `\u003CStyle>` component does not render any actual styles in the document head. It did work fine in 3.15.4.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2976,2977],{"name":2857,"color":2858},{"name":2878,"color":2879},31332,"Nuxt 3.16.0 - Style components are not rendered","2025-03-13T07:45:17Z","https://github.com/nuxt/nuxt/issues/31332",0.6672494,["Reactive",2984],{},["Set"],["ShallowReactive",2987],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fT72IwIWvVWHbdqWq9tUQBPr51erFc0t4l42P-x1_Bls":-1},"/nuxt/ui/3977"]