diff --git a/src/routes/tasks/[task_id]/+page.server.ts b/src/routes/tasks/[task_id]/+page.server.ts
new file mode 100644
index 0000000..bae9647
--- /dev/null
+++ b/src/routes/tasks/[task_id]/+page.server.ts
@@ -0,0 +1,9 @@
+import TasksService from "$lib/server/services/tasks";
+import type { PageServerData } from "./$types";
+
+export const load: PageServerData = async ({ params }) => {
+  const tasks = new TasksService("internal");
+  return {
+    task: await tasks.getByTaskId([params.task_id]),
+  };
+};
diff --git a/src/routes/tasks/[task_id]/+page.svelte b/src/routes/tasks/[task_id]/+page.svelte
new file mode 100644
index 0000000..c3cef46
--- /dev/null
+++ b/src/routes/tasks/[task_id]/+page.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+	import type { PageProps } from "./$types";
+
+	let { data }: PageProps = $props();
+	const task = data.task.tasks[0];
+</script>
+
+<h1>{`[[${task.type.prefix}${task.taskId}]] - ${task.description}`}</h1>
+<div class="container">
+	<p><strong>{task.status}</strong></p>
+	<p><strong>{task.priority}</strong></p>
+</div>
+<div>
+	<h2>Body</h2>
+	<p>{task.body}</p>
+</div>
+
+<style>
+	.container {
+		display: flex;
+		gap: 1rem;
+	}
+</style>