diff --git a/x-pack/plugins/fleet/public/applications/integrations/app.tsx b/x-pack/plugins/fleet/public/applications/integrations/app.tsx
index 172b066443948..40bf59ed86e90 100644
--- a/x-pack/plugins/fleet/public/applications/integrations/app.tsx
+++ b/x-pack/plugins/fleet/public/applications/integrations/app.tsx
@@ -76,7 +76,7 @@ export const IntegrationsAppContext: React.FC<{
                             <Router history={history}>
                               <AgentPolicyContextProvider>
                                 <PackageInstallProvider notifications={startServices.notifications}>
-                                  <IntegrationsHeader {...{ setHeaderActionMenu }} />
+                                  <IntegrationsHeader {...{ setHeaderActionMenu, theme$ }} />
                                   {children}
                                 </PackageInstallProvider>
                               </AgentPolicyContextProvider>
diff --git a/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx b/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx
index e87c63e98ef28..b594171a7bae0 100644
--- a/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx
+++ b/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx
@@ -15,11 +15,13 @@ import { DeploymentDetails } from './deployment_details';
 
 export const IntegrationsHeader = ({
   setHeaderActionMenu,
+  theme$,
 }: {
   setHeaderActionMenu: AppMountParameters['setHeaderActionMenu'];
+  theme$: AppMountParameters['theme$'];
 }) => {
   return (
-    <HeaderPortal {...{ setHeaderActionMenu }}>
+    <HeaderPortal {...{ setHeaderActionMenu, theme$ }}>
       <EuiHeaderSection grow={false}>
         <EuiHeaderSectionItem>
           <EuiHeaderLinks>
diff --git a/x-pack/plugins/fleet/public/applications/integrations/components/header/header_portal.tsx b/x-pack/plugins/fleet/public/applications/integrations/components/header/header_portal.tsx
index d3dbbcf9628ec..ed6a94ff077dc 100644
--- a/x-pack/plugins/fleet/public/applications/integrations/components/header/header_portal.tsx
+++ b/x-pack/plugins/fleet/public/applications/integrations/components/header/header_portal.tsx
@@ -14,14 +14,15 @@ import { toMountPoint } from '../../../../../../../../src/plugins/kibana_react/p
 
 export interface Props {
   setHeaderActionMenu: AppMountParameters['setHeaderActionMenu'];
+  theme$: AppMountParameters['theme$'];
 }
 
-export const HeaderPortal: FC<Props> = ({ children, setHeaderActionMenu }) => {
+export const HeaderPortal: FC<Props> = ({ children, setHeaderActionMenu, theme$ }) => {
   const portalNode = useMemo(() => createPortalNode(), []);
 
   useEffect(() => {
     setHeaderActionMenu((element) => {
-      const mount = toMountPoint(<OutPortal node={portalNode} />);
+      const mount = toMountPoint(<OutPortal node={portalNode} />, { theme$ });
       return mount(element);
     });
 
@@ -29,7 +30,7 @@ export const HeaderPortal: FC<Props> = ({ children, setHeaderActionMenu }) => {
       portalNode.unmount();
       setHeaderActionMenu(undefined);
     };
-  }, [portalNode, setHeaderActionMenu]);
+  }, [portalNode, setHeaderActionMenu, theme$]);
 
   return <InPortal node={portalNode}>{children}</InPortal>;
 };