diff --git a/src/components/.gitkeep b/src/components/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/src/components/LogoutButton.tsx b/src/components/LogoutButton.tsx
new file mode 100644
index 0000000..2e65633
--- /dev/null
+++ b/src/components/LogoutButton.tsx
@@ -0,0 +1,29 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { createClient } from '@/lib/supabase/client'
+
+export default function LogoutButton() {
+  const router = useRouter()
+  const [loading, setLoading] = useState(false)
+
+  async function handleLogout() {
+    setLoading(true)
+
+    const supabase = createClient()
+    await supabase.auth.signOut()
+
+    router.push('/login')
+  }
+
+  return (
+    <button
+      onClick={handleLogout}
+      disabled={loading}
+      className="rounded-md bg-zinc-200 px-3 py-1.5 text-sm font-medium text-zinc-700 hover:bg-zinc-300 focus:outline-none focus:ring-2 focus:ring-zinc-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-zinc-700 dark:text-zinc-200 dark:hover:bg-zinc-600 dark:focus:ring-offset-zinc-900"
+    >
+      {loading ? 'Signing out...' : 'Sign out'}
+    </button>
+  )
+}