diff --git a/web/app/[workspaceSlug]/(pages)/pages/[pageId]/header.tsx b/web/app/[workspaceSlug]/(pages)/pages/[pageId]/header.tsx
index 1250667368..66583c5782 100644
--- a/web/app/[workspaceSlug]/(pages)/pages/[pageId]/header.tsx
+++ b/web/app/[workspaceSlug]/(pages)/pages/[pageId]/header.tsx
@@ -13,6 +13,7 @@ import { BreadcrumbLink, Logo } from "@/components/common";
 // helpers
 import { SPACE_BASE_URL } from "@/helpers/common.helper";
 import { convertHexEmojiToDecimal } from "@/helpers/emoji.helper";
+import { getPageName } from "@/helpers/page.helper";
 // hooks
 import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web components
@@ -93,7 +94,7 @@ export const PageDetailsHeader = observer(() => {
                 type="text"
                 link={
                   <BreadcrumbLink
-                    label={name ?? "Page"}
+                    label={getPageName(name)}
                     icon={
                       <EmojiIconPicker
                         isOpen={isOpen}
diff --git a/web/ee/components/pages/dashboard/list-item.tsx b/web/ee/components/pages/dashboard/list-item.tsx
index c7bb282519..afdd2b7fb5 100644
--- a/web/ee/components/pages/dashboard/list-item.tsx
+++ b/web/ee/components/pages/dashboard/list-item.tsx
@@ -4,6 +4,8 @@ import { useParams } from "next/navigation";
 import { FileText } from "lucide-react";
 // components
 import { Logo } from "@/components/common";
+// helpers
+import { getPageName } from "@/helpers/page.helper";
 // plane web components
 import { WorkspacePageQuickActions } from "@/plane-web/components/pages";
 // plane web hooks
@@ -33,7 +35,7 @@ export const PagesAppDashboardListItem: React.FC<Props> = (props) => {
               <FileText className="size-3.5 text-custom-text-300" />
             )}
           </span>
-          <p className="text-custom-text-200 text-sm">{page.name}</p>
+          <p className="text-custom-text-200 text-sm">{getPageName(page.name)}</p>
         </div>
       </Link>
       {/* quick actions dropdown */}
diff --git a/web/ee/components/pages/sidebar/list-item.tsx b/web/ee/components/pages/sidebar/list-item.tsx
index dc73d7bf84..59a0948f52 100644
--- a/web/ee/components/pages/sidebar/list-item.tsx
+++ b/web/ee/components/pages/sidebar/list-item.tsx
@@ -10,6 +10,7 @@ import { Tooltip } from "@plane/ui";
 import { Logo } from "@/components/common";
 // helpers
 import { cn } from "@/helpers/common.helper";
+import { getPageName } from "@/helpers/page.helper";
 // hooks
 import { useAppTheme } from "@/hooks/store";
 import { usePlatformOS } from "@/hooks/use-platform-os";
@@ -53,7 +54,7 @@ export const PagesAppSidebarListItem: React.FC<Props> = observer((props) => {
             <FileText className="size-3.5" />
           )}
         </span>
-        {!isCollapsed && <p className="truncate text-sm">{page.name}</p>}
+        {!isCollapsed && <p className="truncate text-sm">{getPageName(page.name)}</p>}
       </Link>
     </Tooltip>
   );