\n```\n\n### Will results something like this\n```html\n\u003Cdiv class=\"... root-test base-test\">\n ...\n \u003Cinput class=\"...\" />\n\u003C/div>\n```\n\n### Description\n\nWhen applying themes in `app.config.ts`, both **UInputTags** and **UInputMenu (multiple)** share the same weird behaviour compared with other components, where the class applied to `base` part of the component are applied to `root` part of the component.\n\n### Expected Behaviour\nThe applied class on `base` should be applied to the `\u003Cinput />`, not the `root` part of the component which is the outer `\u003Cdiv />` just like other input components such as **UInput**, **UInputNumber**, or **UTextarea**.\n\nCorrect me if I'm wrong if this are intended, thank you!\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3018,3021,3024],{"name":3019,"color":3020},"bug","d73a4a",{"name":3022,"color":3023},"v3","49DCB8",{"name":3025,"color":3026},"triage","ffffff",4530,"nuxt","ui","open","[UInputTags, UInputMenu] Theming behaviour issues","2025-07-15T17:50:02Z","https://github.com/nuxt/ui/issues/4530",0.6705638,{"description":3036,"labels":3037,"number":3042,"owner":3028,"repository":3029,"state":3030,"title":3043,"updated_at":3044,"url":3045,"score":3046},"### Description\n\nNuxt ui is not picking up my new primary color variables defined in main.css it was woking until I set ssr false.",[3038,3041],{"name":3039,"color":3040},"question","d876e3",{"name":3022,"color":3023},4433,"Nuxt ui not picking up correct variable overrides in ssr false","2025-07-01T10:46:02Z","https://github.com/nuxt/ui/issues/4433",0.68324804,{"description":3048,"labels":3049,"number":3053,"owner":3028,"repository":3028,"state":3030,"title":3054,"updated_at":3055,"url":3056,"score":3057},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v20.11.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: pnpm@9.1.4\r\n- Builder: -\r\n- User Config: modules, experimental, ssr, css, colorMode, nitro, app, pwa, devtools, eslintConfig, i18n, vite, runtimeConfig\r\n- Runtime Modules: @vueuse/nuxt@10.10.0, @unocss/nuxt@0.58.9, @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0, @nuxtjs/color-mode@3.4.1, @vite-pwa/nuxt@0.4.0, @bg-dev/nuxt-naiveui@1.10.1, @nuxtjs/i18n@8.3.1, unplugin-icons/nuxt, nuxt-module-eslint-config@0.1.1\r\n- Build Modules: -\r\n------------------------------\r\n\n\n### Reproduction\n\nNuxt Config:\r\n```ts\r\nexport default defineNuxtConfig({\r\n // ...\r\n runtimeConfig: {\r\n public: {\r\n test: 'prerendered \"test value\" (default)',\r\n onlyRuntime: 'prerendered \"only runtime value\" (default)'\r\n },\r\n },\r\n nitro: {\r\n esbuild: {\r\n options: {\r\n target: 'esnext',\r\n },\r\n },\r\n prerender: {\r\n crawlLinks: false,\r\n routes: ['/'],\r\n },\r\n },\r\n // ...\r\n})\r\n```\r\n\r\n`pages/index.vue`\r\n\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ch1>This Page is prerendered\u003C/h1>\r\n {{config.public.test}} \u003Cbr>\r\n \u003CNuxtLink to=\"/test\">SSR page\u003C/NuxtLink>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup lang=\"ts\">\r\nconst config = useRuntimeConfig()\r\n\u003C/script>\r\n```\r\n\r\n`pages/test.vue`\r\n\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ch1>This Page is not prerendered\u003C/h1>\r\n {{config.public.test}}\u003Cbr>\r\n {{config.public.onlyRuntime}}\u003Cbr>\r\n \u003CNuxtLink to=\"/\">prerendered Page\u003C/NuxtLink>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup lang=\"ts\">\r\nconst config = useRuntimeConfig()\r\n\u003C/script>\r\n```\r\n\r\nenv for `node .output/server/index.mjs`\r\n\r\n```yaml\r\n environment:\r\n - NUXT_PUBLIC_TEST=runtime \"test value\"\r\n - NUXT_PUBLIC_ONLY_RUNTIME=runtime \"only runtime value\"\r\n```\r\n\r\nlink to deployed version: https://app.runtime-config-example.v2.singular-it-test.de/\n\n### Describe the bug\n\nSteps:\r\n1. open https://app.runtime-config-example.v2.singular-it-test.de/\r\n2. see varaibles\r\n3. navigate to SSR page\r\n4. variables are still from builttime\r\n5. refresh page\r\n6. variables are now from runtime\r\n7. navigate back to prerendered\r\n8. variables are still runtime\n\n### Additional context\n\ni think it will be intended that way, but i find the behavior of the runtimeConfig sometimes a bit inconsistent, especially if you prerender parts of the app and others not. (and thus also with regard to the caching of pwa). Depending on the entry point in the app (i.e. whether generated or dynamic), this can lead to different configs, which then persist between the dynamic and static pages. \r\n\r\ni don't expect prerendered parts of the app to pick up the runtime config, but i would assume that when i switch from a static to a non-static page, the runtime variables also play a role. Otherwise, as soon as prerender is active, everything should be set at build time (so that there can no longer be a runtime config) and everything is/needs to be set in the build step to avoid differences depending on the entry point.\r\n\r\nI know that it is not necessarily common to have a different config for generation than for runtime, but especially in my case it is not necessary to set all variables in the build (prerender). and generally the runtime config is also there to set the variables when running the app.\n\n### Logs\n\n_No response_",[3050],{"name":3051,"color":3052},"pending triage","E99695",28847,"strange runtimeConfig behaviour when prerendering parts of the app","2024-09-06T11:27:57Z","https://github.com/nuxt/nuxt/issues/28847",0.69193107,{"description":3059,"labels":3060,"number":3064,"owner":3028,"repository":3029,"state":3065,"title":3066,"updated_at":3067,"url":3068,"score":3069},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.11.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.9\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: devtools, modules, runtimeConfig, app, css, ui, icon, i18n, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.1.0, @nuxt/eslint@1.3.0, @nuxtjs/device@3.2.4, @nuxtjs/i18n@9.5.3, @pinia/nuxt@0.11.0, @vueuse/nuxt@13.1.0, nuxt-lodash@2.5.3\n- Build Modules: -\n\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/vigorous-cerf-pnrc3g\n\n// app.config.ts\nexport default defineAppConfig({\n ui: {\n colors: {\n primary: 'emerald',\n neutral: 'zinc',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n green: 'green',\n blue: 'blue',\n purple: 'purple',\n gray: 'gray',\n },\n }\n}\n\n// nuxt.config.ts\n\nui: {\n theme: {\n colors: [ 'primary', 'secondary', 'success', 'info', 'warning', 'error', 'red', 'orange', 'yellow', 'green', 'blue', 'purple', 'gray' ],\n },\n },\n\n### Description\n\nYesterday everything was working fine, no code was changed, after the upgrade it broke.\nFor example:\n```html\n\u003Cdiv class=\"bg-(--ui-orange)\">\n```\nOr\n```html\n\u003Cdiv class=\"bg-orange\">\n```\nBoth not work\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3061,3062,3063],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},3977,"closed","Extend colors not work after update to v3.1","2025-04-28T10:40:09Z","https://github.com/nuxt/ui/issues/3977",0.62751585,{"description":3071,"labels":3072,"number":3077,"owner":3028,"repository":3028,"state":3065,"title":3078,"updated_at":3079,"url":3080,"score":3081},"### Environment\r\n\r\nWorking directory: /home/andrey/Documents/nuxt-env-test 4:42:45 PM\r\nNuxt project info: 4:42:45 PM\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v20.11.0\r\n- Nuxt Version: 3.11.1\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.5\r\n- Package Manager: pnpm@8.15.5\r\n- Builder: -\r\n- User Config: devtools, runtimeConfig\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://github.com/4dr1en/repro-nuxt-dynamic-env\r\n\r\nThe .env is included in the repo.\r\n> pnpm run dev\r\n\r\nand\r\n\r\n> pnpm preview\r\n\r\nwork\r\n\r\n> source .env && node .output/server/index.mjs\r\n\r\ndo not\r\n\r\n### Describe the bug\r\n\r\nWhen I follow the official documentation:\r\nhttps://nuxt.com/docs/guide/going-further/runtime-config#example\r\n\r\nThe public runtimeConfig is being replaced by the environements variables in developpement and when doing `pnpm preview`.\r\nBut when the nuxt application is started doing `source .env && node .output/server/index.mjs`, the public runtime configuration is left empty.\r\n\r\n\r\n\r\n### Additional context\r\n\r\nI need to update the runtimeConfiguration using the env variables without rebuilding the app, I tried to follow th official [documentation](https://nuxt.com/docs/guide/going-further/runtime-config#example) but it doesn't work in production.\r\n\r\n.env content\r\n```env\r\nNUXT_PUBLIC_MSG=\"Hello world!\"\r\n```\r\n\r\nnuxt.config.ts\r\n```typescript\r\nexport default defineNuxtConfig({\r\n devtools: { enabled: true },\r\n runtimeConfig: {\r\n public: {\r\n msg: ''\r\n }\r\n }\r\n})\r\n```\r\n\r\napp.vue\r\n```typescript\r\n\u003Cscript lang=\"ts\">\r\n export default defineNuxtComponent({\r\n mounted() {\r\n console.log(this.$config.public.msg)\r\n }\r\n })\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n {{ $config.public.msg }}\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n\r\n### Logs\r\ncli\r\n```shell-script\r\n❯ source .env && echo $NUXT_PUBLIC_MSG\r\nHello world!\r\n❯ source .env && node .output/server/index.mjs\r\nListening on http://[::]:3000\r\n```\r\n\r\nbrowser console\r\n```javascript\r\n\u003Cempty string> Mc_nPuuN.js:23:55632\r\n```\r\n\r\nThis is working with `pnpm preview` :\r\n\r\ncli\r\n```shell-script\r\n❯ pnpm preview\r\n\r\n> nuxt-app@ preview /home/andrey/Documents/nuxt-env-test\r\n> nuxt preview\r\n\r\n 5:06:53 PM\r\n ╭────────────────────────────────────────Preview Mode──────────────────────────────────────────╮\r\n │ │\r\n │ You are running Nuxt production build in preview mode. │\r\n │ For production deployments, please directly use node ./server/index.mjs command. │\r\n │ │\r\n │ Node.js: v20.11.0 │\r\n │ Nitro Preset: node-server │\r\n │ Working directory: .output │\r\n │ │\r\n ╰──────────────────────────────────────────────────────────────────────────────────────────────╯\r\n\r\nℹ Loading .env. This will not be loaded when running the server in production. 5:06:53 PM\r\nℹ Starting preview command: node ./server/index.mjs 5:06:53 PM\r\n 5:06:53 PM\r\nListening on http://[::]:3000\r\n```\r\n\r\nbrowser console\r\n```javascript\r\nHello world! [Mc_nPuuN.js:23:55632](http://[::]:3000/_nuxt/Mc_nPuuN.js)\r\n```",[3073,3076],{"name":3074,"color":3075},"3.x","29bc7f",{"name":3051,"color":3052},26520,"NUXT_PUBLIC_XXX environment variables not overriding public runtimeConfig in production","2024-03-27T16:27:15Z","https://github.com/nuxt/nuxt/issues/26520",0.67197794,{"description":3083,"labels":3084,"number":3088,"owner":3028,"repository":3029,"state":3065,"title":3089,"updated_at":3090,"url":3091,"score":3092},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.3.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.9\n- Package Manager: pnpm@9.15.4\n- Builder: -\n- User Config: compatibilityDate, devtools, modules, future, css, runtimeConfig\n- Runtime Modules: @nuxt/ui@3.1.0, @nuxt/image@1.10.0, nuxt-auth-utils@0.5.20, nuxt-svgo@4.0.17\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\n/* main.css */\n@import \"tailwindcss\" theme(static);\n@import \"@nuxt/ui\";\n\n### Description\n\nWhen using the css above, the neutral color (eg. --color-neutral-50, --color-neutral-100, etc ) tailwind variables are missing in the output css file (in :root, :host {} )\nThey are there when not importing @nuxt/ui\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3085,3086,3087],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},3986,"tailwindcss neutral color missing","2025-05-02T09:58:19Z","https://github.com/nuxt/ui/issues/3986",0.67297304,{"description":3094,"labels":3095,"number":3099,"owner":3028,"repository":3029,"state":3065,"title":3100,"updated_at":3101,"url":3102,"score":3103},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.13.1\n- Nuxt Version: 3.17.3\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: hooks, app, runtimeConfig, supabase, routeRules, sitemap, site, compatibilityDate, devtools, modules, css, ui\n- Runtime Modules: @nuxt/ui@3.1.2, @pinia/nuxt@0.11.0, @nuxtjs/supabase@1.5.1, @nuxtjs/seo@3.0.3, @storyblok/nuxt@6.2.4\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.1.2\n\n### Reproduction\n\nchange the border color(I assume should be this variable: --ui-border) in your project to red or blue and check if this color is applied when using only the classes: `border` or `border-b` without specifying the color.\n\n### Description\n\nI want to set the default border color, by default is very dark.\n\nI found that `--ui-border` variable is not used in the border style, maybe I could be wrong.\n\n\u003Cimg width=\"374\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/7f25806c-f5ea-43a1-a2a3-095d71448d43\" />\n\nthis is how the borders are styled in my case, no `--ui-border`\n\n\u003Cimg width=\"542\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/6bb3138e-36e5-46cb-9930-92b608811fe0\" />\n\n\u003Cimg width=\"515\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/16ad3bc6-a8a9-4391-a0c5-542ff3f58121\" />\n\nplease help, \n\nthank you\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3096,3097,3098],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},4218,"Can't set the default border color","2025-05-26T08:34:37Z","https://github.com/nuxt/ui/issues/4218",0.6751139,{"description":3105,"labels":3106,"number":3110,"owner":3028,"repository":3029,"state":3065,"title":3111,"updated_at":3112,"url":3113,"score":3114},"### Environment\n\nWindows 11,\nNode v20.19.0\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.12\n\n### Reproduction\n\ntabs: {\n slots: {\n root: 'flex items-center gap-2',\n list: 'relative **flex-none** p-1 px-0 group',\n indicator: 'absolute transition-[translate,width] duration-200',\n trigger: [\n 'group relative inline-flex items-center min-w-0 data-[state=inactive]:text-muted hover:data-[state=inactive]:not-disabled:text-default font-medium rounded-md disabled:cursor-not-allowed disabled:opacity-75',\n 'transition-colors'\n ],\n content: 'focus:outline-none w-full',\n leadingIcon: 'shrink-0',\n leadingAvatar: 'shrink-0',\n leadingAvatarSize: '',\n label: 'truncate'\n },\n\n### Description\n\nFor me it's working great with Nuxt UI to overwrite \"normal\" styles in the app.config.ts, but if I try to overwrite the component standard flex with flex-none it's not working, it is still flex. Any ideas how to solve or is it a bug?\n\nThanks\n\nChristoph \n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3107,3108,3109],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},4156,"UTabs cannot overwrite flex to flex-none","2025-05-15T15:32:49Z","https://github.com/nuxt/ui/issues/4156",0.67971444,{"description":3116,"labels":3117,"number":3129,"owner":3028,"repository":3028,"state":3065,"title":3130,"updated_at":3131,"url":3132,"score":3133},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v16.20.0\r\n- Nuxt Version: 3.7.3\r\n- CLI Version: 3.8.4\r\n- Nitro Version: 2.6.3\r\n- Package Manager: npm@9.4.2\r\n- Builder: -\r\n- User Config: devtools, runtimeConfig\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-uezcgs?file=nuxt.config.ts\r\n\r\n### Describe the bug\r\n\r\nHint reads:\r\n```\r\nYou can override this value at runtime with NUXT_PUBLIC_A_PP_NAME_S\r\n```\r\n\r\nShould be:\r\n```\r\nYou can override this value at runtime with NUXT_PUBLIC_APP_NAMES\r\n```\r\n\r\n### Additional context\r\n\r\n```ts\r\nexport default defineNuxtConfig({\r\n runtimeConfig: {\r\n public: {\r\n APP_NAMES: 'xyz'\r\n }\r\n }\r\n})\r\n```\r\n\r\nEnvironment variable `NUXT_PUBLIC_APP_NAMES` is properly respected. The issue concerns the documentation exclusively.\r\n\r\n### Logs\r\n\r\n_No response_",[3118,3121,3124,3125,3128],{"name":3119,"color":3120},"good first issue","fbca04",{"name":3122,"color":3123},"types","2875C3",{"name":3074,"color":3075},{"name":3126,"color":3127},"dx","C39D69",{"name":3019,"color":3020},23246,"RuntimeConfig does not display proper environment variable hint when already using UPPER_SNAKE_CASE","2023-11-15T18:58:02Z","https://github.com/nuxt/nuxt/issues/23246",0.68062323,{"labels":3135,"number":3140,"owner":3028,"repository":3028,"state":3065,"title":3141,"updated_at":3142,"url":3143,"score":3144},[3136,3139],{"name":3137,"color":3138},"documentation","5319e7",{"name":3074,"color":3075},14057,"NODE_ENV overwriting results in weird errors","2023-01-19T17:37:47Z","https://github.com/nuxt/nuxt/issues/14057",0.68097705,["Reactive",3146],{},["Set"],["ShallowReactive",3149],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f3YChNcCa9-57pSAxN_65ikYkluTZ9QAeco7gJEEKLII":-1},"/nuxt/ui/4018"]