Lineamientos de desarrollo de la marca para el acceso

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Usa el Acceso con Google con los alcances básicos profile o email e incorpora los siguientes botones estándar a tu app web o para dispositivos móviles:

Estilo Botones Archivos de imagen
Claro

Incluye los botones de acceso en formato PNG, SVG, EPS y de Sketch, en muchas resoluciones. Incluye estados base, de desplazamiento y de presión.

Oscuro

Los archivos SVG, EPS y de Sketch se incluyen en la descarga para que puedas traducir el texto de"Acceder con"o"Acceder". Estos archivos requieren la fuente Roboto.

Si solicitas alcances adicionales, hazlo con autorización incremental (Android, iOS y la Web), y solo solicita la autorización al usuario cuando comience a interactuar con una función que requiere acceso a la API.

Si solicitas alcances para YouTube, usa un botón de YouTube.

Si usas los Servicios de juego de Google Play, también puedes consultar los lineamientos para el desarrollo de la marca de estos servicios.

Acceso con Google y otras opciones de acceso de terceros

Igualdad de importancia

El botón de Acceso con Google debe mostrarse al menos de forma tan destacada como otras opciones de acceso de terceros. Por ejemplo, los botones deben tener aproximadamente el mismo tamaño y tener un peso visual similar.

Cómo hacer coincidir el estilo de tu app

Se recomienda usar el botón estándar de Acceso con Google, ya que permite que los usuarios de Google identifiquen la opción de Google más rápido. Si necesitas adaptar el botón para que coincida con el diseño de tu app o traducir el texto "Acceder con", o "Acceder", sigue estos lineamientos.

Tamaño

Puedes ajustar el botón según sea necesario para diferentes dispositivos y tamaños de pantalla, pero debes conservar la relación de aspecto para que el logotipo de Google no se estire.

Texto

Para alentar a los usuarios a hacer clic en el botón, recomendamos el texto de llamado a la acción "Acceder con Google" o "Registrarse con Google". Debe quedar claro para el usuario que accede a tu app o se registra con sus credenciales de Google, no que se registre para obtener una Cuenta de Google en tu app.

&Google; texto

Puedes usar solo la palabra "Google" en el botón si está acompañada por texto que deje en claro el tipo de acción que se realiza. Por ejemplo:

Acceder con:

Color

Botón "Acceso con Google" con fondo azul Botón "Acceso con Google" con fondo blanco

El color de un botón claro sin presionar es #FFFFFF (blanco). El color de un botón oscuro (azul) sin presionar es #4285F4. El fondo del botón puede ser azul o blanco, pero siempre debe incluir el color estándar de Google (en un mosaico blanco).

Fuente

La fuente del botón es Roboto Medium, una fuente TrueType. Para instalarla, primero descarga la fuente Roboto y descomprime el paquete de descarga. En Mac, haz doble clic en Roboto-Medium.ttf y, luego, en "Install Font". En Windows, arrastra el archivo a la carpeta "Mi PC" > Windows, el de Fuentes. No uses otras fuentes en el botón, excepto como se indica en las situaciones de la sección Cómo hacer coincidir el estilo de tu app.

Para los sitios web que usan un botón de acceso personalizado, puedes cargar la fuente Roboto de Google Fonts.

Padding

El padding a la izquierda (y derecha) del texto debe ser de 8 dp. El logotipo debe tener 18 dp y debe haber 24 dp entre el logotipo y el texto del botón.

Ilustra las dimensiones de los elementos de un botón, incluido el relleno alrededor del texto.

Logotipo de Google en el botón "Acceder con Google"

Independientemente del texto, no puedes cambiar el tamaño ni el color del logotipo de Google. Debe ser la versión en color estándar y aparecer sobre un fondo blanco. Si necesitas crear tu propio logotipo de Google de tamaño personalizado, comienza con cualquiera de los tamaños de logotipo que se incluyen en el paquete de descarga.

Diseño incorrecto del botón

No uses el ícono ni el logotipo de Google solos sin el límite del botón y sin texto para indicar la acción del usuario.
No uses solo un ícono de Google para representar el Acceso con Google.
No utilice versiones oscuras o claras de la "G" de Google.
No coloques el ícono estándar de Google "G" en un fondo de color.
No crees tu propio ícono para el botón.
No uses el término "Google" solo en el botón sin el ícono de Google que lo acompaña.

No se permite el uso de las marcas de Google de formas que no se mencionen en este documento sin el consentimiento previo por escrito de Google (consulta los Lineamientos para el uso de terceros de las características de marca de Google para obtener más información).