Fuentes sans serif limpias para interfaces de apps
Familias sans serif de licencia abierta que se leen con claridad en botones, menús, tablas y pantallas de ajustes, con los pesos que necesita una interfaz.
Save changes
Una interfaz exige más a una tipografía que un titular. Casi todo su texto es breve y pequeño: etiquetas de 12 o 13 píxeles, celdas de tablas, líneas de ayuda bajo un campo. A esos tamaños importan las aperturas abiertas en letras como la a, la e y la s, una altura de x generosa y cifras fáciles de distinguir. Una I mayúscula, una l minúscula y el número 1 no deberían parecerse en un campo de contraseña.
El rango de pesos importa casi tanto. Un producto suele necesitar un peso regular para el texto corrido, uno medium o semibold para los botones y uno bold para destacar, con la diferencia suficiente para notarse de un vistazo. Las familias con un eje de peso variable permiten elegir valores exactos en lugar de conformarse con el estilo con nombre más cercano. Las cursivas son menos importantes en las interfaces que en los artículos, así que aquí figuran algunas familias solo en redonda, indicadas como tales. Si tu producto se publica en varios idiomas, revisa la cobertura de sistemas de escritura que se anota junto a cada familia antes de decidirte.
-
Inter
Dibujada para pantallas, con nueve pesos, cursivas y un eje de tamaño óptico que ajusta las letras entre los usos pequeños y los grandes.
-
Roboto
Nueve pesos con cursivas y un eje de anchura, de modo que una sola familia cubre tablas densas, texto corrido y títulos grandes.
-
Figtree
Pensada para apps web y móviles: siete pesos de Light a Black con cursivas en un único eje variable.
-
DM Sans
Letras geométricas de bajo contraste con un eje de tamaño óptico de 9 a 40, válido tanto para etiquetas como para titulares.
-
Plus Jakarta Sans
Los espacios interiores abiertos y una minúscula algo alta mantienen legibles las etiquetas pequeñas; siete pesos de ExtraLight a ExtraBold con cursivas.
-
Manrope
Un eje de peso variable de ExtraLight a ExtraBold con cirílico y griego para productos multilingües; solo estilos en redonda.
-
IBM Plex Sans
Siete pesos con cursivas y un eje de anchura que estrecha las letras para paneles compactos.
-
Source Sans 3
Diseñada como sans de interfaz: ocho pesos de ExtraLight a Black con cursivas, cirílico y griego.
-
Work Sans
Ajustada para texto en pantalla de 14 a 48 píxeles, con nueve pesos variables y cursivas.
-
Ubuntu
Creada para una interfaz de escritorio y con hinting manual para pantallas; cuatro pesos con cursivas.
-
Nunito Sans
Cuatro ejes variables, entre ellos el tamaño óptico y la altura de las minúsculas, permiten ajustar la densidad sin cambiar de familia.
-
Geist
Una minúscula alta y espacios interiores que siguen abiertos incluso en Black, de modo que las etiquetas gruesas se leen con claridad; nueve pesos con cursivas y cirílico.
-
Public Sans
Una sans neutra creada para el sistema de diseño de un gobierno, en nueve pesos variables con cursivas.
-
Onest
Se sitúa entre lo geométrico y lo humanista, con letras pensadas para distinguirse bien en textos de navegación pequeños; de Thin a Black con cirílico, solo estilos en redonda.
-
Albert Sans
Curvas casi circulares y trazos de grosor casi uniforme en nueve pesos con cursivas; solo latino, con las letras turcas y polacas completas.
-
Be Vietnam Pro
Orientada a productos tecnológicos, con los diacríticos vietnamitas dibujados como prioridad; nueve pesos con cursivas en archivos estáticos.
-
Hanken Grotesk
Nueve pesos variables con cursivas, ajustados para señalética, libros e interfaces.
Las muestras cargan un subconjunto latino básico de cada familia. Todas las familias de esta página tienen licencia abierta; su página indica las condiciones y ofrece los archivos originales.
Preguntas sobre fuentes sans serif limpias para interfaces de apps
¿Puedo incluir estas fuentes en una app comercial?
Todas las familias de esta lista tienen una licencia abierta, en la mayoría de los casos la SIL Open Font License, que permite el uso en productos comerciales y la incorporación en apps. El texto de la licencia viene con cada descarga; lee la página de la familia que elijas para conocer sus condiciones exactas.
¿Una interfaz debe usar una fuente variable o archivos estáticos?
Un archivo variable ofrece todos los pesos en una sola descarga y permite fijar valores intermedios, algo útil cuando un sistema de diseño necesita un 450 o un 550. Los archivos estáticos siguen siendo una buena opción si solo usas dos o tres pesos.
¿Necesito cursivas para el texto de la interfaz?
Rara vez. Las interfaces recurren al peso y al color para destacar. La cursiva resulta útil cuando el producto muestra contenido extenso, como artículos o documentación, dentro de la misma familia tipográfica.
¿Cómo combino una sans de interfaz con una fuente de código?
Varias de las familias de esta lista tienen una versión monoespaciada dibujada con las mismas proporciones. Usarla mantiene la coherencia de alturas y grosor de trazo entre el texto y el código.