How to Upgrade Tailwind CSS to v4 in Next.js 15? #82623
-
SummaryI saw that Tailwind CSS has been upgraded to v4, and I’d like to update it in my project as well. However, I ran into an issue with the new setup — previously, we only needed to adjust the Is there an easy, recommended way to upgrade from Tailwind CSS 3.4.1 to v4 in a Next.js 15.0.3 project? Any guidance, official migration steps, or tips would be greatly appreciated. Additional informationNo response ExampleNo response |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
|
We did some changes to our CSS getting started guide to show TW4: Tailwind themselves have a guide and a tool:
In TW4 you don't really need a tailwind.config.js file - as they auto-scan the project. Be aware that TW4 has some older than 3 years browser compatibility compromises - https://tailwindcss.com/docs/compatibility#browser-support - version 4.1 gave better fallback behavior, but you should still consider your business requirements https://tailwindcss.com/blog/tailwindcss-v4-1#improved-compatibility-with-older-browsers |
Beta Was this translation helpful? Give feedback.
-
|
Alright, thanks. |
Beta Was this translation helpful? Give feedback.
We did some changes to our CSS getting started guide to show TW4:
Tailwind themselves have a guide and a tool:
In TW4 you don't really need a tailwind.config.js file - as they auto-scan the project.
Be aware that TW4 has some older than 3 years browser compatibility compromises - https://tailwindcss.com/docs/compatibility#browser-support - version 4.1 gave better fallback behavior, but you should still consider your business requirements https://tailwindcss.com/blog/tailwindcss-v4-1#improved-compatibility-with-older-browsers