diff --git a/public/hestiaIcon.png b/public/hestiaIcon.png
new file mode 100644
index 00000000..4a2f3d5c
Binary files /dev/null and b/public/hestiaIcon.png differ
diff --git a/src/app/components/signin/GoogleSignInButton.jsx b/src/app/components/signin/GoogleSignInButton.jsx
index 6dad75b2..54002491 100644
--- a/src/app/components/signin/GoogleSignInButton.jsx
+++ b/src/app/components/signin/GoogleSignInButton.jsx
@@ -11,7 +11,7 @@ const GoogleSignInButton = () => {
 
   return (
     <Button
-      className="w-full"
+      className="w-full text-black"
       onClick={() => signIn("google", { callbackUrl })}
     >
       <svg
@@ -24,7 +24,7 @@ const GoogleSignInButton = () => {
         viewBox="0 0 488 512"
       >
         <path
-          fill="red"
+          fill="blue"
           d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
         ></path>
       </svg>
diff --git a/src/app/page.tsx b/src/app/page.tsx
index e40309dd..98abbb4c 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,6 +2,7 @@ import { getServerSession } from "next-auth/next";
 import { AuthOptions } from "./api/auth/[...nextauth]/route";
 import GoogleSignInButton from "./components/signin/GoogleSignInButton";
 import { redirect } from "next/navigation";
+import Link from "next/link";
 
 export default async function Home() {
   const session = await getServerSession(AuthOptions);
@@ -11,9 +12,10 @@ export default async function Home() {
   }
 
   return (
-    <section className="flex min-h-full overflow-hidden pt-16 sm:py-28">
-      <div className="mx-auto flex w-full max-w-2xl flex-col px-4 sm:px-6">
-        <h1 className="text-center text-2xl font-medium tracking-tight text-gray-900">
+    <section className="flex flex-col items-center justify-center min-h-screen bg-gradient-to-r from-brandblue via-hoverblue to-brandmidblue">
+      <div className="w-full max-w-md p-8 bg-white rounded-lg shadow-lg flex flex-col items-center">
+        <img className="h-10 w-7 mb-8" src="/hestiaIcon.png" alt="Logo" />
+        <h1 className="text-3xl font-medium text-gray-900 mb-8 text-center">
           Sign in to your account
         </h1>
         <GoogleSignInButton />