diff --git a/src/components/back-button.svelte b/src/components/back-button.svelte
index 5b6049f..be25484 100644
--- a/src/components/back-button.svelte
+++ b/src/components/back-button.svelte
@@ -1,15 +1,20 @@
 <script>
 	import { goto } from '$app/navigation';
 	import { Redo2 } from 'lucide-svelte';
+	let { path } = $props();
 
 	const handleClick = () => {
-		goto(`/dashboards`);
+		if (path) {
+			goto(path);
+		} else {
+			goto(`/dashboards`);
+		}
 	};
 </script>
 
 <button
 	on:click={handleClick}
-	class="font-BaiJamjuree border-brown text-brown text-md inline-flex cursor-pointer items-center gap-2 rounded-[6px] border-x border-y bg-white px-3 py-1.5 text-sm font-medium underline-offset-4"
+	class="font-BaiJamjuree border-brown text-brown text-md inline-flex w-fit cursor-pointer items-center gap-2 self-end rounded-[6px] border-x border-y bg-white px-3 py-1.5 text-sm font-medium underline-offset-4"
 >
 	<Redo2 class="text-brown rotate-180 transform" />
 	Back
diff --git a/src/routes/project/[project_id]/+page.svelte b/src/routes/project/[project_id]/+page.svelte
index 70f6b5e..3895b63 100644
--- a/src/routes/project/[project_id]/+page.svelte
+++ b/src/routes/project/[project_id]/+page.svelte
@@ -9,6 +9,7 @@
 	import { filterDate, filterGanttTag, tagsList, sortedGantt } from '$lib/store.svelte.js';
 	import { getLocalTimeZone } from '@internationalized/date';
 	import SortButton from '../../../components/sort-button.svelte';
+	import BackButton from '../../../components/back-button.svelte';
 
 	let auth = '';
 	const cookieString = document.cookie;
@@ -139,6 +140,7 @@
 
 <div class="flex flex-col gap-4 px-20">
 	<h1 class="font-Anuphan text-5xl font-semibold">{project.title}</h1>
+	<BackButton path={`/projects/detail/${projectId}`} />
 	<section class="flex min-w-full flex-row">
 		<div class="flex justify-start gap-2">
 			<DateFilter />