diff --git a/components/Modal/src/Modal.tsx b/components/Modal/src/Modal.tsx
index fbb1411c2..e8d80c9c7 100644
--- a/components/Modal/src/Modal.tsx
+++ b/components/Modal/src/Modal.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { ReactNode, useEffect, useRef, useState } from 'react';
 import ModalHeader from './ModalHeader';
 import ModalContent from './ModalContent';
 import ModalFooter, { ModalAction } from './ModalFooter';
@@ -7,7 +7,7 @@ import ModalBackdrop from './ModalBackdrop';
 
 export interface ModalProps {
   open?: boolean;
-  title?: string;
+  title?: ReactNode;
   children?: React.ReactNode;
   actions?: (toggle: (toggle?: boolean) => void) => ModalAction[];
   trigger?: (toggle: (toggle?: boolean) => void) => React.ReactNode;
diff --git a/components/Modal/src/ModalHeader.tsx b/components/Modal/src/ModalHeader.tsx
index b95f8c307..9b0934237 100644
--- a/components/Modal/src/ModalHeader.tsx
+++ b/components/Modal/src/ModalHeader.tsx
@@ -1,9 +1,9 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import ModalTitle from './ModalTitle';
 import ModalClose from './ModalClose';
 
 export interface ModalHeaderProps {
-  title?: string;
+  title?: ReactNode;
   onClose?: () => void;
 }