Skip to main content

GoogleLogoButton

A Google Sign-In button that follows Google's official branding guidelines. Intended for native apps.

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' }} />