diff --git a/src/app/_header/header.tsx b/src/app/_header/header.tsx
index 50db546..3e67240 100644
--- a/src/app/_header/header.tsx
+++ b/src/app/_header/header.tsx
@@ -123,10 +123,12 @@ async function ProfileDropdown({ userId }: { userId: UserId }) {
         <DropdownMenuLabel>{profile.displayName}</DropdownMenuLabel>
         <DropdownMenuSeparator />
         <DropdownMenuItem asChild className="cursor-pointer">
-          <Link className="flex items-center" href={"/api/sign-out"}>
-            <LogOut className="mr-2 h-4 w-4" />
-            Sign Out
-          </Link>
+          <form action="/api/sign-out" method="POST">
+            <Button type="submit" variant="ghost" className="flex items-center hover:bg-transparent">
+              <LogOut className="mr-2 h-4 w-4" />
+              Sign Out
+            </button>
+          </form>
         </DropdownMenuItem>
       </DropdownMenuContent>
     </DropdownMenu>
diff --git a/src/app/api/sign-out/route.ts b/src/app/api/sign-out/route.ts
index 8a99dc4..ca9a0a5 100644
--- a/src/app/api/sign-out/route.ts
+++ b/src/app/api/sign-out/route.ts
@@ -2,7 +2,7 @@ import { lucia, validateRequest } from "@/lib/auth";
 import { cookies } from "next/headers";
 import { redirect } from "next/navigation";
 
-export async function GET(): Promise<Response> {
+export async function POST(): Promise<Response> {
   await new Promise((resolve) => setTimeout(resolve, 1000));
 
   const { session } = await validateRequest();