diff --git a/packages/twenty-front/src/pages/object-record/RecordShowPage.tsx b/packages/twenty-front/src/pages/object-record/RecordShowPage.tsx
index f82058488..bb649ea19 100644
--- a/packages/twenty-front/src/pages/object-record/RecordShowPage.tsx
+++ b/packages/twenty-front/src/pages/object-record/RecordShowPage.tsx
@@ -1,13 +1,13 @@
 import { useEffect } from 'react';
 import { useParams } from 'react-router-dom';
 import { useSetRecoilState } from 'recoil';
-import { IconBuildingSkyscraper } from 'twenty-ui';
 
 import { useFavorites } from '@/favorites/hooks/useFavorites';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
 import { RecordShowContainer } from '@/object-record/record-show/components/RecordShowContainer';
 import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
+import { useIcons } from '@/ui/display/icon/hooks/useIcons';
 import { PageBody } from '@/ui/layout/page/PageBody';
 import { PageContainer } from '@/ui/layout/page/PageContainer';
 import { PageFavoriteButton } from '@/ui/layout/page/PageFavoriteButton';
@@ -41,6 +41,10 @@ export const RecordShowPage = () => {
     recordStoreFamilyState(objectRecordId),
   );
 
+  const { getIcon } = useIcons();
+
+  const headerIcon = getIcon(objectMetadataItem?.icon);
+
   const { record, loading } = useFindOneRecord({
     objectRecordId,
     objectNameSingular,
@@ -83,7 +87,7 @@ export const RecordShowPage = () => {
       <PageHeader
         title={pageName ?? ''}
         hasBackButton
-        Icon={IconBuildingSkyscraper}
+        Icon={headerIcon}
         loading={loading}
       >
         {record && (