diff --git a/client/screens/LoginScreen.js b/client/screens/LoginScreen.js
index a5f92e987b..58980cac27 100644
--- a/client/screens/LoginScreen.js
+++ b/client/screens/LoginScreen.js
@@ -11,6 +11,11 @@ import {
   NativeBaseProvider,
 } from "native-base";
 
+
+import { FontAwesome } from "@expo/vector-icons";
+
+import * as WebBrowser from 'expo-web-browser';
+import * as Google from 'expo-auth-session/providers/google';
 import { useState, useEffect } from "react";
 import useLogin from "../hooks/useLogin";
 import { useAuth } from "../auth/provider";
@@ -117,7 +122,7 @@ export default function Login() {
               Or
             </Heading>
           </HStack>
-          <HStack mt="1" justifyContent="center">
+          <HStack mt="1" justifyContent="center" alignItems="center">
             <Button
               w="100%"
               onPress={() => {
@@ -134,10 +139,12 @@ export default function Login() {
                   console.log(err)
                 })
               }}
-              mt="2"
-              colorScheme="red"
+              colorScheme={"red"}
+              startIcon={
+                <FontAwesome name="google" size={18} color="white" />
+              }
             >
-              {"Sign in with Google"}
+              Sign in with Google
             </Button>
           </HStack>
           {/* Google Login */}
diff --git a/client/screens/RegisterScreen.js b/client/screens/RegisterScreen.js
index 49112dd841..2523bb3882 100644
--- a/client/screens/RegisterScreen.js
+++ b/client/screens/RegisterScreen.js
@@ -11,6 +11,10 @@ import {
   View
 } from "native-base";
 
+import { FontAwesome } from '@expo/vector-icons';
+import * as WebBrowser from 'expo-web-browser';
+import * as Google from 'expo-auth-session/providers/google';
+
 import { useState, useEffect } from "react";
 import useRegister from "../hooks/useRegister";
 import { useRouter } from "expo-router";
@@ -110,10 +114,16 @@ export default function Register() {
               Or
             </Heading>
           </HStack>
-          <HStack mt="1" justifyContent="center">
+          <HStack mt="1" justifyContent="center" alignItems="center">
             <Button
               w="100%"
               onPress={() => {
+                promptAsync();
+              }}
+              colorScheme={"red"}
+              startIcon={
+                <FontAwesome name="google" size={16} color="white" />
+              }
                 signInWithGoogle().then(async (res) => {
                   let { email, name } = res
                   if (email && name) {
@@ -128,7 +138,7 @@ export default function Register() {
               }} mt="2"
               colorScheme="red"
             >
-              {"Sign up with google"}
+              Sign up with Google
             </Button>
           </HStack>
           {/* Google register */}