Skip to main content

GoogleLogoButton

A Google Sign-In button that follows Google's official branding guidelines. Intended for native apps. It renders null when used on the web.

tip

The functionality covered in this page is available in the licensed version. You can get a license here ⭐️.

Features

  • Available in standard and icon-only variants
  • Customizable shape (rectangular or circular)
  • Supports light, dark, and neutral themes
  • Full customization possible via Pressable props
screenshot of buttons

Usage

See API reference for props.

import { GoogleLogoButton } from '@react-native-google-signin/google-signin';

function SignInScreen() {
return (
<GoogleLogoButton
onPress={() => {
// Handle sign in
}}
label="Sign in with Google"
textStyle={{ fontFamily: 'Roboto' }}
/>
);
}

Font Requirements

The button should render its label using the Roboto font with weight of 500 to match Google's branding guidelines. Make sure to:

  1. Include the Roboto font in your app (see example for Expo).
  2. Provide the font family in the textStyle prop:
<GoogleLogoButton textStyle={{ fontFamily: 'Roboto' }} />