v4-migration

5 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 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