Logotipo
El logotipo de Emailable está disponible como logotipo completo con la marca denominativa de Emailable y como icono, cada uno con sus propias variantes de color y casos de uso. Siga las directrices de uso que se indican a continuación.
Formación preferente:
-
Blanco -
Pizarra 50
Formación preferente:
Formación preferente:
-
Blanco -
Pizarra 50
Formación preferente:
Formación preferente:
Formación preferente:
-
Blanco -
Pizarra 50
Formación preferente:
Hazlo:
-
Deje suficiente espacio entre el logotipo y otros elementos o bordes del documento (utilice la letra "e" del logotipo como distancia de seguridad)
-
Utilice la variante correcta en función del fondo (véase más arriba)
No lo hagas:
-
Alterar el logotipo de forma no autorizada. Esto incluye, entre otras cosas: cambiar los colores, transformar desproporcionadamente, aplicar efectos estilísticos (es decir, resplandor, sombra, desenfoque, trazo, etc.)
-
Colocar el logotipo sobre fondos en los que resulte difícil ver la marca denominativa o alguno de los colores del icono
Colores
La paleta de colores oficial de Emailable y los degradados de fondo utilizados para diseño/marca. Para el uso de colores con tipografía, véase Colores de fuentes.
Paleta
-
Principal
-
Pizarra
-
Rojo
-
Naranja
-
Amarillo
-
Verde
-
Cian
-
Azul
-
Fucsia
Gradientes
Todos los degradados son radiales y circulares. Sus orígenes se sitúan a un 20% de los bordes superior y derecho de las formas que los contienen y se extienden en diagonal hasta la esquina inferior izquierda (véase más abajo).
-
Gradiente oscuro
Se utiliza como fondo oscuro estándar.
Principal 800 Principal 950 -
Gradiente más oscuro
Se utiliza como fondo oscuro alternativo.
Principal 900 Principal 950 -
Violeta degradado
Se utiliza como fondo oscuro alternativo.
Principal 500 Principal 800
Tipografía
Las directrices oficiales de estilo tipográfico para Emailable, incluidos los pesos de las fuentes y el uso de los colores en los distintos elementos de la interfaz.
Tipo de letra
Inter
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
~`!@#$%^&*()_+-=,./<>?:;'"|{}[]
-
Regular 400
El peso por defecto. Se utiliza para el cuerpo del texto, descripciones, etc.
-
Medio 500
Se utiliza para determinados enlaces y etiquetas.
-
Semibold 600
Se utiliza para botones, insignias, subtítulos y determinadas cifras.
-
Negrita 700
Se utiliza para títulos, énfasis y estados activos.
Colores de fuente
Los colores corresponden a fondos claros, salvo que se indique lo contrario. Los colores que cambian en el modo oscuro incluyen su equivalente en dicho modo.
General
-
Pizarra 800
El color predeterminado del texto para los encabezados, las etiquetas, el texto destacado y los estados activos.
Modo oscuro: Blanco -
Pizarra 600
Texto del cuerpo o texto de menor importancia.
Modo oscuro: Pizarra 300 -
Pizarra 500
Texto de marcador de posición, insignias neutras, texto de menús secundarios y pestañas inactivas sobre fondos oscuros.
-
Pizarra 300
Pestañas inactivas.
Modo oscuro: Pizarra 500 -
Blanco
Encabezados, etiquetas, texto destacado y estados activos sobre fondos oscuros.
-
Principal 500
Color de contraste para los enlaces de texto, los elementos de navegación activos y determinados subtítulos.
-
Principal 200
Texto del cuerpo o texto de menor importancia sobre fondos con degradado oscuro.
Estado
-
Rojo 500
Mensajes de error e insignias de peligro.
-
Amarillo 500
Insignias de advertencia.
-
Verde 500
Mensajes de éxito e insignias.
-
Azul 500
Insignias informativas.
Adicionales
-
Pizarra 400
Elementos de navegación inactivos en modo oscuro y precios tachados.
-
Pizarra 200
Código en línea y estados de navegación al pasar el cursor en modo oscuro.
-
Principal 700
Estados de los enlaces de texto al pasar el cursor por encima.
Modo oscuro: Principal 300 -
Principal 400
Etiquetas de sección sobre fondos oscuros y enlaces en ventanas emergentes.
-
Principal 300
Enlaces en el pie de página, citas y precios tachados sobre fondos oscuros.
-
Principal 800
Texto de los recuadros predeterminados.
Modo oscuro: Principal 300 -
Azul 800
Texto de los recuadros informativos.
Modo oscuro: Azul 300 -
Verde 800
Texto de los recuadros de éxito.
Modo oscuro: Verde 300 -
Rojo 700
Texto de los recuadros de peligro y mensajes de error en línea.
Modo oscuro: Rojo 300 -
Amarillo 600
Mensajes de advertencia en línea.
-
Verde 600
Marcadores con signos de verificación y etiquetas positivas.