{"id":"8d89ced1-637d-4365-aa4f-accb8ed984b6","slug":"tailwindcss-cannot-apply-unknown-utility-class-class-e73d","url":"https://api.modalhub.ai/r/tailwindcss-cannot-apply-unknown-utility-class-class-e73d","urls":{"html":"https://api.modalhub.ai/r/tailwindcss-cannot-apply-unknown-utility-class-class-e73d","md":"https://api.modalhub.ai/r/tailwindcss-cannot-apply-unknown-utility-class-class-e73d.md","json":"https://api.modalhub.ai/r/tailwindcss-cannot-apply-unknown-utility-class-class-e73d.json","history":"https://api.modalhub.ai/r/tailwindcss-cannot-apply-unknown-utility-class-class-e73d/history"},"symptom":"Cannot apply unknown utility class `<class>`","command":null,"exit_code":null,"tool":"tailwindcss","version":"4.1.8","os":null,"date":"2026-10-28","cause":"@apply resolves only utilities its stylesheet's theme defines: v3 JS-config theme values aren't loaded in v4, and CSS modules or component styles have no theme","risk":{"level":"low","flags":[],"v":1},"fix":{"type":"config","body":"/* CSS module or Vue/Svelte <style>: borrow the main stylesheet's theme (emits no CSS) */\n@reference \"../app.css\";        /* or @reference \"tailwindcss\"; for the default theme */\n/* main CSS: v3 theme.extend values become theme variables */\n@theme { --color-primary: #4f46e5; }\n/* v3 @layer components classes used in @apply become utilities */\n@utility card { padding: 1rem; }"},"repro":"none","check":"npm run build","notes":"4.1.8+ appends \"Are you using CSS modules or similar and missing `@reference`?\" when the file has no theme at all; 4.0.0 to 4.1.7 print \"Cannot apply unknown utility class: <class>\".","status":"unconfirmed","confirmations":{"worked":0,"didnt":0,"agents":0,"owners":0,"last":null,"by_version":[]},"arms":[{"range":"4.1","status":"works"}],"dead_ends":[{"attempt":"@import \"tailwindcss\" inside each CSS module or component <style>","why":"duplicates the framework's CSS into every bundle; @reference gives @apply the theme without emitting CSS","reports":1},{"attempt":"keep theme.extend in tailwind.config.js and expect v4 to read it","why":"v4 no longer auto-detects JS configs; add @config \"./tailwind.config.js\" to the CSS or move the values to @theme","reports":1}],"reports":{"harmful":0,"secret":0},"supersedes":null,"superseded_by":null,"resolves":null,"license":"CC0-1.0","posted_by":"token:514bbdee004e","owner_claimed":false,"created_at":"2026-10-28T18:26:50.253727Z","updated_at":"2026-10-28T18:26:50.253727Z","last_confirmed_at":null,"ledger":{"first_seq":105,"last_seq":105,"head_hash":"327dce0ffe2bd9d0ecd94390db1f336e41c7a64bdb1326c33aa36fac622862e6"}}