You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/docs/upgrade-guide.mdx
+9-3Lines changed: 9 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,11 +3,11 @@ export const description = "Upgrading your Tailwind CSS projects from v3 to v4."
3
3
4
4
Tailwind CSS v4.0 is a new major version of the framework, so while we've worked really hard to minimize breaking changes, some updates are necessary. This guide outlines all the steps required to upgrade your projects from v3 to v4.
5
5
6
-
To simplify the process, we’ve developed a migration tool that can automatically handle the bulk of these changes for you in typical projects.
6
+
**Tailwind CSS v4.0 is designed for Safari 16.4+, Chrome 111+, and Firefox 128+.** If you need to support older browsers, stick with v3.4 until your browser support requirements change.
7
7
8
-
###Using the upgrade tool
8
+
## Using the upgrade tool
9
9
10
-
If you'd like to try upgrading a project from v3 to v4, you can use our upgrade tool to do the vast majority of the heavy lifting for you:
10
+
If you'd like to upgrade a project from v3 to v4, you can use our upgrade tool to do the vast majority of the heavy lifting for you:
11
11
12
12
```sh
13
13
# [!code filename:Terminal]
@@ -80,6 +80,12 @@ Here's a comprehensive list of all the breaking changes in Tailwind CSS v4.0.
80
80
81
81
Our [upgrade tool](##using-the-upgrade-tool) will handle most of these changes for you automatically, so we highly recommend using it if you can.
82
82
83
+
### Browser requirements
84
+
85
+
Tailwind CSS v4.0 is designed for modern browsers and targets Safari 16.4, Chrome 111, and Firefox 128. We depend on modern CSS features like `@property` and `color-mix()` for core framework features, and Tailwind CSS v4.0 will not work in older browsers.
86
+
87
+
If you need to support older browsers, we recommend sticking with v3.4 for now. We're actively exploring a compatibility mode to help people upgrade sooner that we hope to share more news on in the future.
88
+
83
89
### Removed @tailwind directives
84
90
85
91
In v4 you import Tailwind using a regular CSS `@import` statement, not using the `@tailwind` directives you used in v3:
0 commit comments