diff --git a/apps/service-catalog/app/catalogs/[catalogId]/page.tsx b/apps/service-catalog/app/catalogs/[catalogId]/page.tsx
index ff84584b8..8aedea469 100644
--- a/apps/service-catalog/app/catalogs/[catalogId]/page.tsx
+++ b/apps/service-catalog/app/catalogs/[catalogId]/page.tsx
@@ -1,7 +1,27 @@
-export default async function CatalogPage() {
+import { Card, PageBanner } from '@catalog-frontend/ui';
+import { getTranslateText, localization } from '@catalog-frontend/utils';
+import styles from './services-page.module.css';
+import cn from 'classnames';
+import { Organization } from '@catalog-frontend/types';
+import { getOrganization } from '@catalog-frontend/data-access';
+import { Params } from 'next/dist/shared/lib/router/utils/route-matcher';
+
+export default async function CatalogPage({ params }: Params) {
+  const { catalogId } = params;
+  const organization: Organization = await getOrganization(catalogId).then((res) => res.json());
   return (
-    <div>
-      <h1> Tjenestekatalog - velg mellom offentlig tjeneste og tjeneste</h1>
-    </div>
+    <>
+      <PageBanner
+        title={localization.catalogType.service}
+        subtitle={getTranslateText(organization.prefLabel).toString()}
+      />
+      <div className={cn(styles.cardsContainer, 'container')}>
+        <Card
+          title={localization.publicServices}
+          href={`/catalogs/${catalogId}/public-services`}
+        />
+        <Card title={localization.services} />
+      </div>
+    </>
   );
 }
diff --git a/apps/service-catalog/app/catalogs/[catalogId]/services-page.module.css b/apps/service-catalog/app/catalogs/[catalogId]/services-page.module.css
new file mode 100644
index 000000000..6a532d5bf
--- /dev/null
+++ b/apps/service-catalog/app/catalogs/[catalogId]/services-page.module.css
@@ -0,0 +1,6 @@
+.cardsContainer {
+  display: flex;
+  gap: 40px;
+  padding-top: 50px;
+  padding-bottom: 50px;
+}
diff --git a/apps/service-catalog/app/page.tsx b/apps/service-catalog/app/page.tsx
index a754c1cff..eebb16694 100644
--- a/apps/service-catalog/app/page.tsx
+++ b/apps/service-catalog/app/page.tsx
@@ -1,7 +1,7 @@
 export default async function HomePage() {
   return (
     <div>
-      <h1>Service Catalog - velg mellom offentlig tjeneste og tjeneste</h1>
+      <h1>Her er det ingenting</h1>
     </div>
   );
 }
diff --git a/libs/utils/src/lib/language/nb.ts b/libs/utils/src/lib/language/nb.ts
index 3a5b3935f..7778f335b 100644
--- a/libs/utils/src/lib/language/nb.ts
+++ b/libs/utils/src/lib/language/nb.ts
@@ -15,6 +15,8 @@ export const nb = {
   somethingWentWrong: 'Beklager, noe gikk galt. Prøv på nytt litt senere.',
   allCatalogs: 'Alle kataloger',
   chooseOrganizaiton: 'Velg virksomhet',
+  services: 'Tjenester',
+  publicServices: 'Offentlige tjenester',
   catalogType: {
     concept: 'Begrepskatalog',
     dataset: 'Datasettkatalogen',