From a8764eeecf617bf29cccf102948cfba6081535df Mon Sep 17 00:00:00 2001
From: Gabriel Miranda <gabrielmfern@outlook.com>
Date: Tue, 20 Jan 2026 14:12:48 -0300
Subject: [PATCH] fix(tailwind): non-inlined styles getting HTML entities on
 React 18 (#2858)

---
 .changeset/rare-meals-lie.md       | 5 +++++
 packages/tailwind/src/tailwind.tsx | 6 +++++-
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/rare-meals-lie.md

diff --git a/.changeset/rare-meals-lie.md b/.changeset/rare-meals-lie.md
new file mode 100644
index 000000000..e2d936be3
--- /dev/null
+++ b/.changeset/rare-meals-lie.md
@@ -0,0 +1,5 @@
+---
+"@react-email/tailwind": patch
+---
+
+fix non-inlined styles getting html entities in React 18
diff --git a/packages/tailwind/src/tailwind.tsx b/packages/tailwind/src/tailwind.tsx
index a44625531..aa088735a 100644
--- a/packages/tailwind/src/tailwind.tsx
+++ b/packages/tailwind/src/tailwind.tsx
@@ -134,7 +134,11 @@ export function Tailwind({ children, config }: TailwindProps) {
       if (elementWithInlinedStyles.type === 'head') {
         appliedNonInlineStyles = true;
 
-        const styleElement = <style>{generate(nonInlineStyles)}</style>;
+        const styleElement = (
+          <style
+            dangerouslySetInnerHTML={{ __html: generate(nonInlineStyles) }}
+          />
+        );
 
         return React.cloneElement(
           elementWithInlinedStyles,