diff --git a/src/lib/components/Artefact.svelte b/src/lib/components/Artefact.svelte
index 609e15f..c9b7672 100644
--- a/src/lib/components/Artefact.svelte
+++ b/src/lib/components/Artefact.svelte
@@ -50,7 +50,11 @@
 </script>
 
 <Card class="flex min-w-full flex-col justify-start gap-5 p-5">
-	<h3 class="col-span-2 break-words hyphens-auto">{artefact.title}</h3>
+	<a
+		class="col-span-2 mb-2 text-2xl font-medium break-words hyphens-auto text-gray-700"
+		href={`/project/1f30e10f-8ce1-4432-8974-25323e18b929/artefact/${artefact.uuid}`}
+		>{artefact.title}</a
+	>
 	<div class="col-span-2 flex flex-wrap items-start justify-start">
 		{#each artefact.tags as tag}
 			<button
diff --git a/src/routes/project/[project]/+page.svelte b/src/routes/project/[project]/+page.svelte
index f00269e..cf956f6 100644
--- a/src/routes/project/[project]/+page.svelte
+++ b/src/routes/project/[project]/+page.svelte
@@ -2,7 +2,7 @@
 	import ArtefactsView from '$lib/components/ArtefactsView.svelte';
 	import { page } from '$app/stores';
 	import { state } from '$lib/view.svelte';
-	let project = state.projects.find(({ uuid }) => $page.params.project == uuid);
+	let project = $derived(state.projects.find(({ uuid }) => $page.params.project == uuid));
 </script>
 
 <h1>Project Overview: {project?.name}</h1>