diff --git a/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.styled.tsx b/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.styled.tsx
deleted file mode 100644
index 73c729ac..00000000
--- a/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.styled.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import styled from 'styled-components';
-import { spacings } from '../../../../tokens/spacings';
-import { theme } from '../../../../tokens/theme';
-
-export const CaseResultCard = styled.div`
-  display: flex;
-  flex-direction: row;
-
-  width: 60%;
-  column-gap: ${spacings.LARGE};
-  padding-left: ${spacings.LARGE};
-
-  background-color: ${theme.light.ui.background.light};
-
-  &:hover {
-    background-color: ${theme.light.ui.background.medium};
-    cursor: pointer;
-  }
-`;
diff --git a/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.tsx b/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.tsx
deleted file mode 100644
index f797179b..00000000
--- a/src/features/Results/CaseResult/CaseResultCard/CaseResultCard.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { useNavigate } from 'react-router-dom';
-import { ResultType } from '../../../../pages/ModelPages/Results/Results';
-import * as Styled from './CaseResultCard.styled';
-
-export const CaseResultCard = ({ result }: { result: ResultType }) => {
-  const navigate = useNavigate();
-  const handleClick = () => {
-    navigate(`${result.caseId}`);
-  };
-
-  return (
-    <Styled.CaseResultCard onClick={handleClick}>
-      <h2>{result.case}</h2>
-      {result.finished ? <h4>Finished</h4> : <h4>Not computed yet!</h4>}
-    </Styled.CaseResultCard>
-  );
-};
diff --git a/src/features/Results/CaseResult/CaseResultList/CaseResultList.styled.tsx b/src/features/Results/CaseResult/CaseResultList/CaseResultList.styled.tsx
deleted file mode 100644
index a702fc25..00000000
--- a/src/features/Results/CaseResult/CaseResultList/CaseResultList.styled.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import styled from 'styled-components';
-import { spacings } from '../../../../tokens/spacings';
-
-export const CaseResultList = styled.div`
-  display: flex;
-  flex-direction: column;
-
-  column-gap: ${spacings.LARGE};
-  row-gap: ${spacings.LARGE};
-
-  margin: ${spacings.XXX_LARGE};
-`;
diff --git a/src/features/Results/CaseResult/CaseResultList/CaseResultList.tsx b/src/features/Results/CaseResult/CaseResultList/CaseResultList.tsx
deleted file mode 100644
index 78a08596..00000000
--- a/src/features/Results/CaseResult/CaseResultList/CaseResultList.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { ResultType } from '../../../../pages/ModelPages/Results/Results';
-import { CaseResultCard } from '../../CaseResult/CaseResultCard/CaseResultCard';
-import * as Styled from './CaseResultList.styled';
-
-export const CaseResultList = ({ results }: { results: ResultType[] }) => {
-  return (
-    <Styled.CaseResultList>
-      {results.map((res: ResultType) => (
-        <CaseResultCard key={res.caseId} result={res} />
-      ))}
-    </Styled.CaseResultList>
-  );
-};
diff --git a/src/pages/ModelPages/Results/Results.tsx b/src/pages/ModelPages/Results/Results.tsx
index 0c44c49a..0ce016af 100644
--- a/src/pages/ModelPages/Results/Results.tsx
+++ b/src/pages/ModelPages/Results/Results.tsx
@@ -1,6 +1,36 @@
-import { CaseResultList } from '../../../features/Results/CaseResult/CaseResultList/CaseResultList';
+/* eslint-disable max-lines-per-function */
+import { CaseResultView } from '../../../features/Results/CaseResult/CaseResultView/CaseResultView';
 import { NoResults } from '../../../features/Results/NoResults/NoResults';
 
+export interface VariogramResultListType {
+  caseId: number;
+  title: string;
+  resultList: VariogramResultType[];
+}
+
+export interface VariogramResultType {
+  identifier: number;
+  family: string;
+  computeMethod: string;
+  modelArea: string;
+  attribute: string;
+  quality: GLfloat;
+  sigma: GLfloat;
+  approved: string;
+}
+
+export interface ObjectResultType {
+  identifier: number;
+  family: string;
+  CWMean: GLfloat;
+  CHMean: GLfloat;
+  CWSD: GLfloat;
+  CHSD: GLfloat;
+  CWCount: GLfloat;
+  CHCount: GLfloat;
+  approved: string;
+}
+
 export type ResultType = {
   caseId: string;
   case: string;
@@ -8,14 +38,83 @@ export type ResultType = {
 };
 export const Results = () => {
   const loaded = true;
-  const results: ResultType[] = [
-    { caseId: '1', case: 'Variogramcase 1', finished: true },
-    { caseId: '2', case: 'Variogramcase 2', finished: false },
+  const caseList: VariogramResultListType[] = [
+    {
+      caseId: 1,
+      title: 'Variogram Case 1',
+      resultList: [
+        {
+          identifier: 0,
+          family: 'exponential',
+          computeMethod: 'Net-to-gross',
+          modelArea: 'Left',
+          attribute: 'Porosity',
+          quality: 0.6427819811789964,
+          sigma: 0.06967589201242001,
+          approved: 'rejected',
+        },
+        {
+          identifier: 1,
+          family: 'gaussian',
+          computeMethod: 'Net-to-gross',
+          modelArea: 'Proximal',
+          attribute: 'Porosity',
+          quality: 0.5432924009373808,
+          sigma: 0.0670758033212357,
+          approved: 'pending',
+        },
+      ],
+    },
+    {
+      caseId: 3,
+      title: 'Variogram Case 3',
+      resultList: [
+        {
+          identifier: 2,
+          family: 'general_exponential',
+          computeMethod: 'Indicator / Architectural Element (AE)',
+          modelArea: 'Distal',
+          attribute: 'Porosity',
+          quality: 0.5580294305723851,
+          sigma: 0.0678988627745677,
+          approved: 'approved',
+        },
+      ],
+    },
+  ];
+
+  const objectList: ObjectResultType[] = [
+    {
+      identifier: 3,
+      family: 'channel',
+      CWMean: 190.15,
+      CHMean: 1.94,
+      CWSD: 68.69,
+      CHSD: 0.68,
+      CWCount: 863,
+      CHCount: 863,
+      approved: 'approved',
+    },
+    {
+      identifier: 4,
+      family: 'channel',
+      CWMean: 134.47,
+      CHMean: 1.76,
+      CWSD: 59.93,
+      CHSD: 0.73,
+      CWCount: 754,
+      CHCount: 754,
+      approved: 'approved',
+    },
   ];
 
   return (
     <>
-      {loaded && results ? <CaseResultList results={results} /> : <NoResults />}
+      {loaded && (caseList.length !== 0 || objectList.length !== 0) ? (
+        <CaseResultView caseList={caseList} objectList={objectList} />
+      ) : (
+        <NoResults />
+      )}
     </>
   );
 };
diff --git a/src/router.tsx b/src/router.tsx
index 98159b2d..c4b814a4 100644
--- a/src/router.tsx
+++ b/src/router.tsx
@@ -1,7 +1,6 @@
 import { createBrowserRouter, NonIndexRouteObject } from 'react-router-dom';
 import { App } from './App';
 import { ModelView } from './features/ModelView/ModelView';
-import { CaseResultView } from './features/Results/CaseResult/CaseResultView/CaseResultView';
 import { About } from './pages/About/About';
 import { Api } from './pages/Api/Api';
 import { Browse } from './pages/Browse/Browse';
@@ -47,7 +46,6 @@ const appRoutes = (tabs as NonIndexRouteObject[]).concat([
         path: 'results',
         element: <Results />,
       },
-      { path: 'results/:caseId', element: <CaseResultView /> },
     ],
   },
 ]);