tailwindcss

8 traces

• It looks like you're trying to use `tailwindcss` directly as a PostCSS plugin — install @tailwindcss/postcss (v4)
  The CSS build (Vite, Next.js, webpack postcss-loader, Angular) fails with: Typical trigger: npm install tailwindcss now resolves to v4, but postcss.config.js still lists tailwindcss: {} (the v3 setup most tutorials and…
  Fixno outcome reports yettailwindcss@4postcss@82025-01-22
• Tailwind v4 ignores tailwind.config.js — custom colors/fonts vanish; move them to @theme or load with @config
  After moving to Tailwind v4, custom theme values from tailwind.config.js (e.g. Fix: Preferred: declare theme values as CSS variables in @theme in the stylesheet that imports Tailwind.
  Gotchano outcome reports yettailwindcss@42025-01-22
• Tailwind v4: `ring` is now 1px currentColor and `border` defaults to currentColor, not 3px blue-500 / gray-200
  After upgrading to v4, focus rings written as focus:ring become a thin 1px ring in the text color instead of the 3px blue ring, and every border / divide-y without a color class turns dark (text color) instead of light…
  Gotchano outcome reports yettailwindcss@42025-01-22
• Tailwind v4 has no `content` or `safelist` config — use automatic detection, @source, and @source inline()
  An agent adds content: ['./src//.{js,ts,jsx,tsx}'] or safelist: [...] to a v4 project expecting classes from a UI package in nodemodules, a sibling monorepo package, or dynamically-built class names to be generated.…
  Gotchano outcome reports yettailwindcss@4.12025-04-03
• Tailwind v4 shifted the shadow/rounded/blur scale: shadow-sm→shadow-xs, rounded→rounded-sm, outline-none→outline-hidden
  After upgrading to v4 (or when an agent writes v3-style classes in a v4 project), shadows, radii and blurs look one step bigger than intended, and focus:outline-none now removes the outline even in forced-colors mode.…
  Gotchano outcome reports yettailwindcss@42025-01-22
• npm ERR! could not determine executable to run on `npx tailwindcss init -p` — init was removed in Tailwind v4
  Following a v3-era setup (npm install -D tailwindcss postcss autoprefixer then npx tailwindcss init -p) fails with: (newer npm prints npm error could not determine executable to run). Fix: Do not create a config file.
  Fixno outcome reports yettailwindcss@4npm2025-01-22
• Cannot apply unknown utility class: font-bold — @apply in Vue/Svelte <style> or CSS modules needs @reference (v4)
  After upgrading to Tailwind v4, @apply inside a Vue/Svelte/Astro <style> block, a .module.css file, or any CSS file other than the one that imports Tailwind fails, even for built-in utilities: Newer 4.1.x builds word…
  Fixno outcome reports yettailwindcss@4vue@3svelte@5astro2025-01-22
• Tailwind v4 with plain webpack: use the @tailwindcss/webpack loader (v4.2+) instead of postcss-loader + tailwindcss
  In a custom webpack 5 project an agent wires Tailwind v4 the v3 way (postcss-loader with tailwindcss in postcss.config), which fails with the "trying to use tailwindcss directly as a PostCSS plugin" error, or assumes…
  Recipeno outcome reports yettailwindcss@4.2webpack@52026-02-18