Tipografía


Al utilizar una escala tipográfica clara y concisa, mantenemos un patrón de jerarquías visuales fácil de seguir para cualquier usuario.

Familias tipográficas

Roboto
Roboto Slab

Descarga Roboto aquí

Descarga Roboto Slab aquí

Tipografía diseñada para entornos digitales, de carácter moderno y fácil lectura, su estética sobria no interfiere con el contenido. Buen funcionamiento en tamaños pequeños, y buena legibilidad en pantallas de baja resolución.

Es la tipografía por defecto del sistema operativo android, lo que acelera los tiempos de carga en estos dispositivos.

Escala tipográfica principal

Ejemplo Color Peso Tamaño Line Spacing
h1

Título 1er nivel

Bold 36px 48px 0
h2

Título 2do nivel

Medium 32px 36px 0.23px
h3

Título 3er nivel

Bold 24px 28px 0.18px
h4

Título 4to nivel

Bold 24px 28px 0.18px
h5
Título 5to nivel
Bold 18px 20px 0.1px
h6
Título 6to nivel
Bold 16px 24px 0.1px
p

Body

Regular 24px 28px 0.18px
a

Body link

Medium 16px 24px 0.5px
p alt

Body Blog

Regular 18px 32px 0.5px
p_sm

Body Blog

Regular 18px 32px 0.5px
span Subtítulo
Medium 14px 16px 1px
#000000
#757575
#0176DE
#FFFFFF
usos alternativos
Ejemplo Color Peso Tamaño Line Spacing
p_x

Body Gris Comprimido

Bold 36px 48px 0
p_x_sm

Body Pequeño expandido

Bold 36px 48px 0
span_x
subtítulo extendido
Bold 36px 48px 0

Estilos de Cita

Ejemplo Color Peso Tamaño Line Spacing
quote_xl
Cita Blog
Bold 34px 50px 0
quote
Cita Normal
Regular 24px 32px 0.18
#000000
#757575
#FFFFFF