로그인 브랜드 가이드라인

모바일 또는 웹 앱에서 기본적인 profile 또는 email 범위로 Google 로그인을 사용하고 다음의 표준 버튼을 통합하세요.

스타일	버튼	이미지 파일
밝음		파일 다운로드 PNG, SVG, EPS, Sketch 형식의 로그인 버튼이 다양한 해상도로 제공되며 여기에는 기본, 마우스 오버 및 누름 상태가 포함되어 있습니다.
어두움

다운로드 파일에 Sketch, SVG, EPS 파일이 포함되어 있으므로 '다음 계정으로 로그인' 또는 '로그인' 텍스트를 번역할 수 있습니다. 이러한 파일을 사용하려면 Roboto 글꼴이 필요합니다.

추가적인 범위를 요청하는 경우, 단계적 승인 (Android, iOS, 웹)을 사용하여 사용자가 API 액세스가 필요한 기능과 상호작용을 시작할 때만 승인 요청 메시지를 표시하세요.

YouTube 범위를 요청하는 경우 YouTube 버튼을 사용하세요.

Google Play 게임 서비스를 사용하려면 Google Play 게임 서비스 브랜드 가이드라인도 참조하세요.

동등한 가시성

Google 로그인 버튼은 다른 타사 로그인 옵션과 적어도 동등한 수준으로 눈에 띄어야 합니다. 예를 들어 버튼 크기는 거의 같아야 하고 시각적으로 비슷한 비중을 가져야 합니다.

앱 스타일에 맞추기

Google 사용자가 Google 옵션을 더 빠르게 알아볼 수 있도록 표준 Google 로그인 버튼을 사용하는 것이 좋습니다. 앱 디자인에 맞게 버튼을 조정하거나 '다음 계정으로 로그인' 또는 '로그인' 텍스트를 번역해야 한다면 다음 가이드라인을 따르세요.

크기

다양한 기기 및 화면 크기에 따라 버튼의 크기를 조절할 수 있지만, Google 로고가 늘어나지 않도록 가로세로 비율은 유지해야 합니다.

텍스트

사용자가 버튼을 클릭하도록 유도하려면 클릭 유도문안 텍스트인 'Google 계정으로 로그인' 또는 'Google 계정으로 가입'을 사용하는 것이 좋습니다. 앱에서 Google 계정에 가입하거나 등록하는 것이 아니라, Google 사용자 인증 정보를 사용해 앱에 로그인하거나 가입하게 된다는 점을 사용자가 명확하게 알 수 있어야 합니다.

'Google' 텍스트

어떤 작업인지 명확하게 안내하는 텍스트가 가까이 있다면 버튼 안에 'Google'이라는 단어만 넣을 수 있습니다. 예를 들면 다음과 같습니다.

다음 계정으로 로그인:

컬러

눌리지 않은 밝은색 버튼의 색상은 #FFFFFF(흰색)이며 눌리지 않은 어두운색(파란색) 버튼의 색상은 #4285F4입니다. 버튼 배경은 파란색이나 흰색을 사용할 수 있지만, 항상 흰색 타일에 표시된 표준 색상의 Google 'G' 로고를 포함해야 합니다.

글꼴

버튼 글꼴은 TrueType 글꼴인 Roboto Medium입니다. 글꼴을 설치하려면 우선 Roboto 글꼴을 다운로드하고 다운로드 번들의 압축을 해제하세요. Mac의 경우 Roboto-Medium.ttf를 더블클릭한 다음 '서체 설치'를 클릭합니다. Windows의 경우 파일을 '내 컴퓨터' > 'Windows' > 'Fonts' 폴더로 드래그합니다. 앱 스타일에 맞추기에 명시된 상황이 아니라면 버튼에 다른 글꼴을 사용하지 마세요.

웹사이트에서 맞춤 로그인 버튼을 사용한다면 Google Fonts에서 Roboto 글꼴을 로드할 수 있습니다.

여백

텍스트 왼쪽 및 오른쪽의 여백은 8dp여야 합니다. 로고는 18dp여야 하며, 로고와 버튼 텍스트 사이는 24dp만큼 떨어져 있어야 합니다.

'Google 계정으로 로그인' 버튼에 사용되는 Google 로고

텍스트와 관계없이 Google 'G' 로고의 크기나 색상은 변경할 수 없습니다. 로고는 표준 색상 버전이어야 하며 흰색 배경에 표시되어야 합니다. Google 로고 크기를 변경해야 한다면 다운로드 번들에 포함된 로고 크기 중 하나를 먼저 사용해 보세요.

잘못된 버튼 디자인

	버튼 경계선 및 사용자 작업을 나타내는 텍스트 없이 Google 아이콘 또는 로고를 단독으로 사용하지 않습니다.
	Google 아이콘만 사용하여 Google 로그인을 나타내지 않습니다.
	어둡거나 밝은 버전의 Google 'G' 로고를 사용하지 않습니다.
	표준 색상의 Google 'G' 아이콘을 색이 있는 배경에 표시하지 않습니다.
	버튼에 사용되는 아이콘을 직접 만들지 않습니다.
	Google 아이콘이 없는 상태에서 버튼에 'Google'이라는 단어만 사용하지 않습니다.