diff --git a/web/app/components/plugins/marketplace/home/home-constants.ts b/web/app/components/plugins/marketplace/home/home-constants.ts
new file mode 100644
index 00000000000..643a8631cc1
--- /dev/null
+++ b/web/app/components/plugins/marketplace/home/home-constants.ts
@@ -0,0 +1,6 @@
+/**
+ * Height of the marketplace home header in pixels. The sticky catalog
+ * navigation pins itself directly below the header, so the header height and
+ * the sticky offset must stay in sync; both read this constant.
+ */
+export const HOME_HEADER_HEIGHT_PX = 48
diff --git a/web/app/components/plugins/marketplace/home/home-header.tsx b/web/app/components/plugins/marketplace/home/home-header.tsx
index 874a7fbcf54..d16f8359029 100644
--- a/web/app/components/plugins/marketplace/home/home-header.tsx
+++ b/web/app/components/plugins/marketplace/home/home-header.tsx
@@ -4,6 +4,7 @@ import Link from '@/next/link'
import MarketplaceLogoDark from '@/public/marketplace/dify-marketplace-logo-dark.svg'
import MarketplaceLogo from '@/public/marketplace/dify-marketplace-logo.svg'
import HomeCatalogTabs from './home-catalog-tabs'
+import { HOME_HEADER_HEIGHT_PX } from './home-constants'
// HomeCreatorCenter stays in its own client module: it derives styles via
// buttonVariants(), which cannot be invoked inside this server component.
import HomeCreatorCenter from './home-creator-center'
@@ -28,10 +29,8 @@ const HomeHeader = ({
}: HomeHeaderProps) => {
return (