diff --git a/packages/next/src/client/components/app-router-headers.ts b/packages/next/src/client/components/app-router-headers.ts
index 0489abab5fdd7..feebabb83d37c 100644
--- a/packages/next/src/client/components/app-router-headers.ts
+++ b/packages/next/src/client/components/app-router-headers.ts
@@ -5,7 +5,7 @@ export const NEXT_ROUTER_STATE_TREE = 'Next-Router-State-Tree' as const
 export const NEXT_ROUTER_PREFETCH = 'Next-Router-Prefetch' as const
 export const NEXT_URL = 'Next-Url' as const
 export const FETCH_CACHE_HEADER = 'x-vercel-sc-headers' as const
-export const RSC_CONTENT_TYPE_HEADER = 'text/x-component' as const
+export const RSC_CONTENT_TYPE_HEADER = 'text/x-component; charset=utf-8' as const
 export const RSC_VARY_HEADER =
   `${RSC}, ${NEXT_ROUTER_STATE_TREE}, ${NEXT_ROUTER_PREFETCH}` as const
 
diff --git a/test/e2e/app-dir/app/index.test.ts b/test/e2e/app-dir/app/index.test.ts
index aa0264b4cc401..cceca180ed5cf 100644
--- a/test/e2e/app-dir/app/index.test.ts
+++ b/test/e2e/app-dir/app/index.test.ts
@@ -218,22 +218,22 @@ createNextDescribe(
       })
     }
 
-    it('should use text/x-component for flight', async () => {
+    it('should use text/x-component; charset=utf-8 for flight', async () => {
       const res = await next.fetch('/dashboard/deployments/123', {
         headers: {
           ['RSC'.toString()]: '1',
         },
       })
-      expect(res.headers.get('Content-Type')).toBe('text/x-component')
+      expect(res.headers.get('Content-Type')).toBe('text/x-component; charset=utf-8')
     })
 
-    it('should use text/x-component for flight with edge runtime', async () => {
+    it('should use text/x-component; charset=utf-8 for flight with edge runtime', async () => {
       const res = await next.fetch('/dashboard', {
         headers: {
           ['RSC'.toString()]: '1',
         },
       })
-      expect(res.headers.get('Content-Type')).toBe('text/x-component')
+      expect(res.headers.get('Content-Type')).toBe('text/x-component; charset=utf-8')
     })
 
     it('should return the `vary` header from edge runtime', async () => {