diff --git a/packages/docusaurus-theme-classic/src/theme-classic.d.ts b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
index 78c25c3e48aa..323ef6effb24 100644
--- a/packages/docusaurus-theme-classic/src/theme-classic.d.ts
+++ b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
@@ -410,7 +410,7 @@ declare module '@theme/CodeBlock' {
     readonly children: ReactNode;
     readonly className?: string;
     readonly metastring?: string;
-    readonly title?: string;
+    readonly title?: ReactNode;
     readonly language?: string;
     readonly showLineNumbers?: boolean | number;
   }
diff --git a/website/_dogfooding/_pages tests/code-block-tests.mdx b/website/_dogfooding/_pages tests/code-block-tests.mdx
index 83454500f7b2..dfff4af5a345 100644
--- a/website/_dogfooding/_pages tests/code-block-tests.mdx	
+++ b/website/_dogfooding/_pages tests/code-block-tests.mdx	
@@ -188,6 +188,28 @@ Multi-line text inside `pre` will turn into one-liner, but it's okay (https://gi
   <br />
 </CodeBlock>
 
+## Code blocks with `ReactNode` in title
+
+<CodeBlock
+  language="yaml"
+  title={
+    <div
+      style={{
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+      }}>
+      <span>
+        <code>ReactNode</code> title
+      </span>{' '}
+      <span className="badge badge--primary">YAML</span>
+    </div>
+  }>
+  {`link:
+  title: front page
+  path: /docs/`}
+</CodeBlock>
+
 ## Code blocks with line numbering tests
 
 ```jsx