diff --git a/package.json b/package.json
index 60c25183c..83d76f241 100644
--- a/package.json
+++ b/package.json
@@ -56,6 +56,7 @@
     "react-csv": "2.2.2",
     "react-dom": "18.2.0",
     "react-ga4": "2.1.0",
+    "react-helmet": "6.1.0",
     "react-i18next": "14.1.0",
     "react-image-crop": "11.0.5",
     "react-qr-code": "2.0.12",
@@ -126,6 +127,7 @@
     "@types/react": "18.2.61",
     "@types/react-csv": "1.1.10",
     "@types/react-dom": "18.2.19",
+    "@types/react-helmet": "^6",
     "@types/uuid": "9.0.8",
     "@types/validator": "13.11.9",
     "@typescript-eslint/eslint-plugin": "7.4.0",
diff --git a/src/components/item/ItemMain.tsx b/src/components/item/ItemMain.tsx
index b8f58f185..5cd886888 100644
--- a/src/components/item/ItemMain.tsx
+++ b/src/components/item/ItemMain.tsx
@@ -1,3 +1,5 @@
+import { Helmet } from 'react-helmet';
+
 import { Box, Divider, Typography, styled } from '@mui/material';
 
 import { DiscriminatedItem } from '@graasp/sdk';
@@ -52,32 +54,37 @@ const ItemMain = ({ id, children, item }: Props): JSX.Element => {
   const { isChatboxMenuOpen, setIsChatboxMenuOpen } = useLayoutContext();
 
   return (
-    <Box id={id} p={2} className={ITEM_MAIN_CLASS} height="100%">
-      {isChatboxMenuOpen && (
-        <ItemPanel open={isChatboxMenuOpen}>
-          <DrawerHeader
-            handleDrawerClose={() => {
-              setIsChatboxMenuOpen(false);
-            }}
-            // todo
-            direction="rtl"
-          >
-            <Typography variant="h6">
-              {translateBuilder(BUILDER.ITEM_CHATBOX_TITLE, {
-                name: item.name,
-              })}
-            </Typography>
-          </DrawerHeader>
-          <Divider />
-          <Chatbox item={item} />
-        </ItemPanel>
-      )}
-      <StyledContainer open={isChatboxMenuOpen}>
-        <ItemHeader showNavigation />
+    <>
+      <Helmet>
+        <title>{item.name}</title>
+      </Helmet>
+      <Box id={id} p={2} className={ITEM_MAIN_CLASS} height="100%">
+        {isChatboxMenuOpen && (
+          <ItemPanel open={isChatboxMenuOpen}>
+            <DrawerHeader
+              handleDrawerClose={() => {
+                setIsChatboxMenuOpen(false);
+              }}
+              // todo
+              direction="rtl"
+            >
+              <Typography variant="h6">
+                {translateBuilder(BUILDER.ITEM_CHATBOX_TITLE, {
+                  name: item.name,
+                })}
+              </Typography>
+            </DrawerHeader>
+            <Divider />
+            <Chatbox item={item} />
+          </ItemPanel>
+        )}
+        <StyledContainer open={isChatboxMenuOpen}>
+          <ItemHeader showNavigation />
 
-        {children}
-      </StyledContainer>
-    </Box>
+          {children}
+        </StyledContainer>
+      </Box>
+    </>
   );
 };
 
diff --git a/src/components/pages/BookmarkedItemsScreen.tsx b/src/components/pages/BookmarkedItemsScreen.tsx
index 3d3ab911b..96db54e63 100644
--- a/src/components/pages/BookmarkedItemsScreen.tsx
+++ b/src/components/pages/BookmarkedItemsScreen.tsx
@@ -1,3 +1,5 @@
+import { Helmet } from 'react-helmet';
+
 import { Box } from '@mui/material';
 
 import { Loader } from '@graasp/ui';
@@ -27,14 +29,19 @@ const BookmarkedItemsLoadableContent = (): JSX.Element | null => {
 
   if (filteredData) {
     return (
-      <Box m={2}>
-        <ItemHeader showNavigation={false} />
-        <Items
-          id={BOOKMARKED_ITEMS_ID}
-          title={translateBuilder(BUILDER.BOOKMARKED_ITEMS_TITLE)}
-          items={filteredData.map((d) => d.item)}
-        />
-      </Box>
+      <>
+        <Helmet>
+          <title>{translateBuilder(BUILDER.BOOKMARKED_ITEMS_TITLE)}</title>
+        </Helmet>
+        <Box m={2}>
+          <ItemHeader showNavigation={false} />
+          <Items
+            id={BOOKMARKED_ITEMS_ID}
+            title={translateBuilder(BUILDER.BOOKMARKED_ITEMS_TITLE)}
+            items={filteredData.map((d) => d.item)}
+          />
+        </Box>
+      </>
     );
   }
 
diff --git a/src/components/pages/HomeScreen.tsx b/src/components/pages/HomeScreen.tsx
index 21258a9ad..947354ec3 100644
--- a/src/components/pages/HomeScreen.tsx
+++ b/src/components/pages/HomeScreen.tsx
@@ -1,4 +1,5 @@
 import { useState } from 'react';
+import { Helmet } from 'react-helmet';
 
 import { Box, LinearProgress } from '@mui/material';
 
@@ -104,35 +105,40 @@ const HomeLoadableContent = (): JSX.Element => {
 
   if (accessibleItems) {
     return (
-      <UppyContextProvider enable={isSuccess}>
-        <FileUploader />
-        <Box p={2} height="100%">
-          <ItemHeader showNavigation={false} />
-          <Items
-            id={ACCESSIBLE_ITEMS_TABLE_ID}
-            title={translateBuilder(BUILDER.MY_ITEMS_TITLE)}
-            items={accessibleItems.data}
-            headerElements={[
-              itemSearch.input,
-              <NewItemButton key="newButton" />,
-            ]}
-            ToolbarActions={ItemActions}
-            onShowOnlyMeChange={onShowOnlyMeChange}
-            showOnlyMe={showOnlyMe}
-            page={page}
-            setPage={setPage}
-            totalCount={accessibleItems.totalCount}
-            onSortChanged={onSortChanged}
-            pageSize={ITEM_PAGE_SIZE}
-            showDropzoneHelper
-          />
-          {isFetching && (
-            <Box sx={{ width: '100%' }}>
-              <LinearProgress />
-            </Box>
-          )}
-        </Box>
-      </UppyContextProvider>
+      <>
+        <Helmet>
+          <title>{translateBuilder(BUILDER.MY_ITEMS_TITLE)}</title>
+        </Helmet>
+        <UppyContextProvider enable={isSuccess}>
+          <FileUploader />
+          <Box p={2} height="100%">
+            <ItemHeader showNavigation={false} />
+            <Items
+              id={ACCESSIBLE_ITEMS_TABLE_ID}
+              title={translateBuilder(BUILDER.MY_ITEMS_TITLE)}
+              items={accessibleItems.data}
+              headerElements={[
+                itemSearch.input,
+                <NewItemButton key="newButton" />,
+              ]}
+              ToolbarActions={ItemActions}
+              onShowOnlyMeChange={onShowOnlyMeChange}
+              showOnlyMe={showOnlyMe}
+              page={page}
+              setPage={setPage}
+              totalCount={accessibleItems.totalCount}
+              onSortChanged={onSortChanged}
+              pageSize={ITEM_PAGE_SIZE}
+              showDropzoneHelper
+            />
+            {isFetching && (
+              <Box sx={{ width: '100%' }}>
+                <LinearProgress />
+              </Box>
+            )}
+          </Box>
+        </UppyContextProvider>
+      </>
     );
   }
 
diff --git a/src/components/pages/PublishedItemsScreen.tsx b/src/components/pages/PublishedItemsScreen.tsx
index dbf2b4157..28f3ca61b 100644
--- a/src/components/pages/PublishedItemsScreen.tsx
+++ b/src/components/pages/PublishedItemsScreen.tsx
@@ -1,3 +1,5 @@
+import { Helmet } from 'react-helmet';
+
 import { Box } from '@mui/material';
 
 import { Loader } from '@graasp/ui';
@@ -29,14 +31,19 @@ const PublishedItemsLoadableContent = (): JSX.Element | null => {
 
   if (filteredData) {
     return (
-      <Box mx={2}>
-        <ItemHeader showNavigation={false} />
-        <Items
-          id={PUBLISHED_ITEMS_ID}
-          title={translateBuilder(BUILDER.PUBLISHED_ITEMS_TITLE)}
-          items={filteredData ?? []}
-        />
-      </Box>
+      <>
+        <Helmet>
+          <title>{translateBuilder(BUILDER.PUBLISHED_ITEMS_TITLE)}</title>
+        </Helmet>
+        <Box mx={2}>
+          <ItemHeader showNavigation={false} />
+          <Items
+            id={PUBLISHED_ITEMS_ID}
+            title={translateBuilder(BUILDER.PUBLISHED_ITEMS_TITLE)}
+            items={filteredData ?? []}
+          />
+        </Box>
+      </>
     );
   }
 
diff --git a/src/components/pages/RecycledItemsScreen.tsx b/src/components/pages/RecycledItemsScreen.tsx
index cc9c19b68..c2e42388c 100644
--- a/src/components/pages/RecycledItemsScreen.tsx
+++ b/src/components/pages/RecycledItemsScreen.tsx
@@ -1,3 +1,5 @@
+import { Helmet } from 'react-helmet';
+
 import { Box } from '@mui/material';
 
 import { Loader } from '@graasp/ui';
@@ -58,20 +60,25 @@ const RecycleBinLoadableContent = (): JSX.Element | null => {
 
   if (filteredData) {
     return (
-      <Box id={RECYCLED_ITEMS_ROOT_CONTAINER} mx={2}>
-        <ItemHeader showNavigation={false} />
-        <Items
-          id={RECYCLED_ITEMS_ID}
-          clickable={false}
-          title={translateBuilder(BUILDER.RECYCLE_BIN_TITLE)}
-          items={filteredData}
-          actions={RowActions}
-          ToolbarActions={ToolbarActions}
-          showThumbnails={false}
-          enableMemberships={false}
-          totalCount={recycledItems?.length}
-        />
-      </Box>
+      <>
+        <Helmet>
+          <title>{translateBuilder(BUILDER.RECYCLE_BIN_TITLE)}</title>
+        </Helmet>
+        <Box id={RECYCLED_ITEMS_ROOT_CONTAINER} mx={2}>
+          <ItemHeader showNavigation={false} />
+          <Items
+            id={RECYCLED_ITEMS_ID}
+            clickable={false}
+            title={translateBuilder(BUILDER.RECYCLE_BIN_TITLE)}
+            items={filteredData}
+            actions={RowActions}
+            ToolbarActions={ToolbarActions}
+            showThumbnails={false}
+            enableMemberships={false}
+            totalCount={recycledItems?.length}
+          />
+        </Box>
+      </>
     );
   }
 
diff --git a/src/components/pages/SharedItemsScreen.tsx b/src/components/pages/SharedItemsScreen.tsx
index dac88c561..f65bdfaee 100644
--- a/src/components/pages/SharedItemsScreen.tsx
+++ b/src/components/pages/SharedItemsScreen.tsx
@@ -1,3 +1,5 @@
+import { Helmet } from 'react-helmet';
+
 import { Alert, Box } from '@mui/material';
 
 import { Loader } from '@graasp/ui';
@@ -25,21 +27,26 @@ const SharedItemsLoadableContent = (): JSX.Element | null => {
 
   if (filteredItems) {
     return (
-      <Box id={SHARED_ITEMS_ROOT_CONTAINER} mx={2}>
-        <Alert severity="warning" sx={{ mt: 3 }}>
-          {translateBuilder(
-            "You can also find the items of this page in ''My Graasp''. This page will be unavailable soon.",
-          )}
-        </Alert>
-        <ItemHeader showNavigation={false} />
-        <Items
-          id={SHARED_ITEMS_ID}
-          title={translateBuilder(BUILDER.SHARED_ITEMS_TITLE)}
-          items={filteredItems}
-          canMove={false}
-          totalCount={filteredItems?.length}
-        />
-      </Box>
+      <>
+        <Helmet>
+          <title>{translateBuilder(BUILDER.SHARED_ITEMS_TITLE)}</title>
+        </Helmet>
+        <Box id={SHARED_ITEMS_ROOT_CONTAINER} mx={2}>
+          <Alert severity="warning" sx={{ mt: 3 }}>
+            {translateBuilder(
+              "You can also find the items of this page in ''My Graasp''. This page will be unavailable soon.",
+            )}
+          </Alert>
+          <ItemHeader showNavigation={false} />
+          <Items
+            id={SHARED_ITEMS_ID}
+            title={translateBuilder(BUILDER.SHARED_ITEMS_TITLE)}
+            items={filteredItems}
+            canMove={false}
+            totalCount={filteredItems?.length}
+          />
+        </Box>
+      </>
     );
   }
   if (isError) {
diff --git a/yarn.lock b/yarn.lock
index 0a229f65b..81cccc075 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3369,6 +3369,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/react-helmet@npm:^6":
+  version: 6.1.11
+  resolution: "@types/react-helmet@npm:6.1.11"
+  dependencies:
+    "@types/react": "npm:*"
+  checksum: 10/e329d8ad82c365fec7dd7d91c8b6d167faac30cef0d9f1e27d7e895172a0ebfa65829fb4acabbe79283b01cbbe5840a845caeb50148ceef6f3fad42b3c2c4bdc
+  languageName: node
+  linkType: hard
+
 "@types/react-redux@npm:^7.1.20":
   version: 7.1.33
   resolution: "@types/react-redux@npm:7.1.33"
@@ -7587,6 +7596,7 @@ __metadata:
     "@types/react": "npm:18.2.61"
     "@types/react-csv": "npm:1.1.10"
     "@types/react-dom": "npm:18.2.19"
+    "@types/react-helmet": "npm:^6"
     "@types/uuid": "npm:9.0.8"
     "@types/validator": "npm:13.11.9"
     "@typescript-eslint/eslint-plugin": "npm:7.4.0"
@@ -7634,6 +7644,7 @@ __metadata:
     react-csv: "npm:2.2.2"
     react-dom: "npm:18.2.0"
     react-ga4: "npm:2.1.0"
+    react-helmet: "npm:6.1.0"
     react-i18next: "npm:14.1.0"
     react-image-crop: "npm:11.0.5"
     react-qr-code: "npm:2.0.12"
@@ -11392,6 +11403,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-fast-compare@npm:^3.1.1":
+  version: 3.2.2
+  resolution: "react-fast-compare@npm:3.2.2"
+  checksum: 10/a6826180ba75cefba1c8d3ac539735f9b627ca05d3d307fe155487f5d0228d376dac6c9708d04a283a7b9f9aee599b637446635b79c8c8753d0b4eece56c125c
+  languageName: node
+  linkType: hard
+
 "react-ga4@npm:2.1.0":
   version: 2.1.0
   resolution: "react-ga4@npm:2.1.0"
@@ -11399,6 +11417,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-helmet@npm:6.1.0":
+  version: 6.1.0
+  resolution: "react-helmet@npm:6.1.0"
+  dependencies:
+    object-assign: "npm:^4.1.1"
+    prop-types: "npm:^15.7.2"
+    react-fast-compare: "npm:^3.1.1"
+    react-side-effect: "npm:^2.1.0"
+  peerDependencies:
+    react: ">=16.3.0"
+  checksum: 10/eff25231384bb0a229870a0552839953a59af17f0ff5e8bca1b8c8fdf19a329e4c00c7fa2fcedc8be5d73f5c7bebb30cf9a32ea58efc7c8f726a10dba51f48a2
+  languageName: node
+  linkType: hard
+
 "react-i18next@npm:14.0.8":
   version: 14.0.8
   resolution: "react-i18next@npm:14.0.8"
@@ -11635,6 +11667,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-side-effect@npm:^2.1.0":
+  version: 2.1.2
+  resolution: "react-side-effect@npm:2.1.2"
+  peerDependencies:
+    react: ^16.3.0 || ^17.0.0 || ^18.0.0
+  checksum: 10/8c31aaec5b383d942ff1775b12c45022239d1250d1a00a238bac3c07e0fe266c71991e2814ae16a5d9b855bcd96ba95817d48ab3f34738f0bb32036ebb1abb1a
+  languageName: node
+  linkType: hard
+
 "react-text-mask@npm:5.5.0":
   version: 5.5.0
   resolution: "react-text-mask@npm:5.5.0"