diff --git a/reflex/.templates/web/postcss.config.js b/reflex/.templates/web/postcss.config.js
index 1e7129835..483f37854 100644
--- a/reflex/.templates/web/postcss.config.js
+++ b/reflex/.templates/web/postcss.config.js
@@ -1,7 +1,5 @@
 module.exports = {
   plugins: {
-    "postcss-import": {},
-    tailwindcss: {},
-    autoprefixer: {},
+    "@tailwindcss/postcss": {},
   },
-}
+};
diff --git a/reflex/.templates/web/styles/tailwind.css b/reflex/.templates/web/styles/tailwind.css
index e1c383749..0e487a7ef 100644
--- a/reflex/.templates/web/styles/tailwind.css
+++ b/reflex/.templates/web/styles/tailwind.css
@@ -1,6 +1,5 @@
-@import "tailwindcss/base";
+@import "tailwindcss";
 
-@import "@radix-ui/themes/styles.css";
+@config '../tailwind.config.js';
 
-@tailwind components;
-@tailwind utilities;
+@import "@radix-ui/themes/styles.css";
\ No newline at end of file
diff --git a/reflex/app.py b/reflex/app.py
index 6e66257b4..0bffc2bb9 100644
--- a/reflex/app.py
+++ b/reflex/app.py
@@ -1291,8 +1291,6 @@ class App(MiddlewareMixin, LifespanMixin):
                     "content", constants.Tailwind.CONTENT
                 )
                 _submit_work(compiler.compile_tailwind, config.tailwind)
-            else:
-                _submit_work(compiler.remove_tailwind_from_postcss)
 
             # Wait for all compilation tasks to complete.
             compile_results.extend(
diff --git a/reflex/compiler/compiler.py b/reflex/compiler/compiler.py
index 81de50182..0b8d455b5 100644
--- a/reflex/compiler/compiler.py
+++ b/reflex/compiler/compiler.py
@@ -515,25 +515,6 @@ def compile_tailwind(
     return output_path, code
 
 
-def remove_tailwind_from_postcss() -> tuple[str, str]:
-    """If tailwind is not to be used, remove it from postcss.config.js.
-
-    Returns:
-        The path and code of the compiled postcss.config.js.
-    """
-    # Get the path for the output file.
-    output_path = str(get_web_dir() / constants.Dirs.POSTCSS_JS)
-
-    code = [
-        line
-        for line in Path(output_path).read_text().splitlines(keepends=True)
-        if "tailwindcss: " not in line
-    ]
-
-    # Compile the config.
-    return output_path, "".join(code)
-
-
 def purge_web_pages_dir():
     """Empty out .web/pages directory."""
     if not is_prod_mode() and environment.REFLEX_PERSIST_WEB_DIR.get():
diff --git a/reflex/constants/installer.py b/reflex/constants/installer.py
index baad18f48..9e89715e3 100644
--- a/reflex/constants/installer.py
+++ b/reflex/constants/installer.py
@@ -191,9 +191,8 @@ class PackageJson(SimpleNamespace):
         "universal-cookie": "7.2.2",
     }
     DEV_DEPENDENCIES = {
-        "autoprefixer": "10.4.20",
+        "@tailwindcss/postcss": "4.0.4",
         "postcss": "8.5.1",
-        "postcss-import": "16.1.0",
     }
     OVERRIDES = {
         # This should always match the `react` version in DEPENDENCIES for recharts compatibility.
diff --git a/reflex/constants/style.py b/reflex/constants/style.py
index 5b31ce9b3..129f40c9d 100644
--- a/reflex/constants/style.py
+++ b/reflex/constants/style.py
@@ -7,7 +7,7 @@ class Tailwind(SimpleNamespace):
     """Tailwind constants."""
 
     # The Tailwindcss version
-    VERSION = "tailwindcss@3.4.17"
+    VERSION = "tailwindcss@4.0.4"
     # The Tailwind config.
     CONFIG = "tailwind.config.js"
     # Default Tailwind content paths
diff --git a/tests/integration/test_tailwind.py b/tests/integration/test_tailwind.py
index eb0fde759..819a5349a 100644
--- a/tests/integration/test_tailwind.py
+++ b/tests/integration/test_tailwind.py
@@ -10,7 +10,7 @@ from reflex.testing import AppHarness
 
 PARAGRAPH_TEXT = "Tailwind Is Cool"
 PARAGRAPH_CLASS_NAME = "text-red-500"
-TEXT_RED_500_COLOR = ["rgba(239, 68, 68, 1)", "rgb(239, 68, 68)"]
+TEXT_RED_500_COLOR = ["oklch(0.637 0.237 25.331)"]
 
 
 def TailwindApp(