Guía de marca
El logotipo, los iconos, los colores y la tipografía de OVOKY, y cómo usarlos. Cada valor de esta página es estático e idéntico al que usa la web.
Logotipo
Tres versiones de color
El logotipo se compone de cinco glifos geométricos. Deja a cada lado un espacio libre de 0,4 veces su altura y no lo uses nunca con menos de 72 px de ancho.
Espacio libre
El cuadrado sombreado mide 0,4 × la altura del logotipo.
No
- Cambiar el color del logotipo fuera de las tres versiones
- Poner el logotipo cielo sobre fondos blancos o claros
- Añadir sombras, contornos o degradados al logotipo
- Estirar, girar o recrear el logotipo con una fuente
Icono de app
El símbolo sobre un degradado
El primer glifo solo, centrado y a un tercio del ancho del icono, sobre un degradado vertical de dos colores. El azul es el predeterminado.
Color
Dos familias simétricas
El azul y el verde van cada uno de un tono pálido a uno profundo. Los neutros tienden hacia el azul marino. Cielo y menta son solo para fondos oscuros.
Rosa y ciruela (marca)
- #050003
Noche
Hero, pie de página, escena 3D
- #1F0D25
Ciruela
Franjas y tarjetas oscuras
- #911D6E
Cinta
Cintas, rellenos rosa intenso
- #FF488B
Rosa
Botones principales, acentos sobre oscuro
- #D6176A
Baya
Enlaces, cifras, texto rosa sobre claro
- #FF9EC9
Brillo
Texto rosa sobre oscuro
- #FBE4EE
Rubor
Chips, insignias, botones discretos
Neutros (con tinte ciruela)
- #1C0D22
Tinta
Texto, botones sólidos
- #6A5870
Atenuado
Texto secundario
- #E6D8E3
Línea
Bordes
- #F9F2F6
Papel 2
Fondo de sección
- #FDFBFC
Papel
Fondo de página
Azul (producto, secundario)
- #CCEEFF
Hielo
Maquetas del producto
- #33BBFF
Cielo
Versión principal del logotipo
- #006699
Océano
Maquetas del producto
- #004466
Marino
Maquetas del producto
Verde (producto, secundario)
- #CCFFEE
Espuma
Maquetas del producto
- #33FFBB
Menta
Estados en las maquetas
- #009966
Esmeralda
Estados en las maquetas
Azul profundo
#006699 → #004466
Verde profundo
#009966 → #006644
Velo
Fondos del hero y de destacados
Acento de titular
Océano → esmeralda sobre claro
Tipografía
Google Sans
Google Sans para titulares y texto, Google Sans Code para etiquetas. Titulares en negrita con espaciado ajustado, siempre con mayúscula solo inicial.
Display · Google Sans Bold
Marca más, que te marquen menos
Título de sección · display-2
Atiende bien cada llamada
Texto · Google Sans Regular 17 px
La ficha aparece antes de que te digan «hola». Notas, rellamadas, emails y SMS van al mismo historial.
Etiqueta · Google Sans Code SemiBold, mayúsculas
Marcador predictivo · En directo · 32 informes
Interfaz
Botones y etiquetas
Acciones principales en marino, acciones de acento en menta con texto en tinta, acciones secundarias con contorno. Un solo botón principal por vista.
- Tinta sobre papel para el texto; océano para los enlaces (6,2:1)
- Esmeralda para iconos y texto grande; bosque para texto verde pequeño
- Cielo y menta solo sobre marino o tinta
¿Necesitas algo más para prensa o partners?
Escríbenos y te enviaremos los archivos o las indicaciones que necesites.