diff --git a/src/app/components/LoginButton.tsx b/src/app/components/LoginButton.tsx
index 0da40f9..6b4181f 100644
--- a/src/app/components/LoginButton.tsx
+++ b/src/app/components/LoginButton.tsx
@@ -7,7 +7,7 @@ export default function LoginButton({ text }: { text: string }) {
   return (
     <button
       onClick={() => signIn("discord")}
-      className="flex cursor-pointer items-center gap-2 rounded-md bg-[#5865F2] px-4 py-2 text-white"
+      className="flex cursor-pointer items-center gap-2 rounded-md bg-[#5865F2] px-4 py-2 text-white hover:bg-[#4654C0]"
     >
       <FaDiscord />
       {text}
diff --git a/src/app/components/LogoutButton.tsx b/src/app/components/LogoutButton.tsx
index 9ba7408..c334517 100644
--- a/src/app/components/LogoutButton.tsx
+++ b/src/app/components/LogoutButton.tsx
@@ -7,7 +7,7 @@ export default function LogoutButton() {
   return (
     <button
       onClick={() => signOut()}
-      className="cursor-pointer rounded-lg bg-red-500 p-2 text-white"
+      className="cursor-pointer rounded-lg bg-red-500 p-2 text-white hover:bg-white hover:text-red-500"
       aria-label="Logout"
     >
       <CiLogout size={24} />