diff --git a/src/lib/components/DropdownButton.svelte b/src/lib/components/DropdownButton.svelte
index cb749f6..41d340c 100644
--- a/src/lib/components/DropdownButton.svelte
+++ b/src/lib/components/DropdownButton.svelte
@@ -1,3 +1,7 @@
-<div class="px-3 py-1.5 flex space-x-1 hover:bg-neutral-600 transition-all">
+<script>
+	export let href = '';
+</script>
+
+<a {href} class="flex px-3 py-1.5 space-x-1 transition-all hover:bg-neutral-600">
 	<slot />
-</div>
+</a>
diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte
index 6c8f2b4..837045c 100644
--- a/src/lib/components/Header.svelte
+++ b/src/lib/components/Header.svelte
@@ -1,25 +1,21 @@
 <script>
-	import { user } from '$lib/stores';
-
 	import HeaderLink from '$lib/components/HeaderLink.svelte';
 	import Dropdown from '$lib/components/Dropdown.svelte';
 	import DropdownButton from '$lib/components/DropdownButton.svelte';
-	import { Cog, LogOut } from 'lucide-svelte';
 </script>
 
 <div
-	class="w-full h-full py-auto flex px-4 place-content-between rounded-xl
-    bg-neutral-200 dark:bg-neutral-900 transition-colors"
+	class="flex place-content-between px-4 w-full h-full rounded-xl transition-colors py-auto bg-neutral-200 dark:bg-neutral-900"
 >
-	<div class="my-auto flex space-x-4">
-		<p class="my-auto text-xl hover:scale-105 focus:scale-105 active:scale-95 transition-all">
+	<div class="flex my-auto space-x-4">
+		<p class="my-auto text-xl transition-all hover:scale-105 focus:scale-105 active:scale-95">
 			File Uploader
 		</p>
-		<div class="flex space-x-2 my-auto">
+		<div class="flex my-auto space-x-2">
 			<HeaderLink href="/dashboard">Dashboard</HeaderLink>
 		</div>
 	</div>
-	<div class="my-auto flex space-x-2">
+	<div class="flex my-auto space-x-2">
 		<Dropdown>
 			<DropdownButton>
 				<p class="my-auto">Uploads</p>
@@ -27,7 +23,7 @@
 			<DropdownButton>
 				<p class="my-auto">Settings</p>
 			</DropdownButton>
-			<DropdownButton>
+			<DropdownButton href="/api/auth/logout">
 				<p class="my-auto text-red-500">Logout</p>
 			</DropdownButton>
 		</Dropdown>
diff --git a/src/lib/server/database.js b/src/lib/server/database.js
index 3e49d37..aa80fbf 100644
--- a/src/lib/server/database.js
+++ b/src/lib/server/database.js
@@ -61,3 +61,11 @@ export async function getSession(id) {
 
 	return session;
 }
+
+export async function deleteSession(id) {
+	if (!id) return false;
+
+	return await prisma.session.delete({
+		where: { id }
+	});
+}
diff --git a/src/routes/api/auth/login/+server.js b/src/routes/api/auth/login/+server.js
index 05a77a5..aaf2a15 100644
--- a/src/routes/api/auth/login/+server.js
+++ b/src/routes/api/auth/login/+server.js
@@ -6,7 +6,7 @@ import { verifyHash } from '$lib/server/crypto';
 
 /** @type {import('./$types').RequestHandler} */
 export async function POST(event) {
-	const { request, cookies, locals } = event;
+	const { request, cookies } = event;
 	const body = await request.json();
 
 	if (!body?.email || !email(body?.email))
diff --git a/src/routes/api/auth/logout/+server.js b/src/routes/api/auth/logout/+server.js
new file mode 100644
index 0000000..01dbad2
--- /dev/null
+++ b/src/routes/api/auth/logout/+server.js
@@ -0,0 +1,17 @@
+import { redirect } from '@sveltejs/kit';
+import { getSession, deleteSession } from '$lib/server/database';
+import { COOKIE } from '$lib/config';
+
+/** @type {import('./$types').RequestHandler} */
+export async function GET({ cookies }) {
+	const session = await getSession(cookies.get(COOKIE));
+	if (!session) {
+		cookies.delete(COOKIE, { path: '/' });
+		return redirect(302, '/');
+	}
+
+	await deleteSession(session.id);
+	cookies.delete(COOKIE, { path: '/' });
+
+	redirect(302, '/');
+}