12 fuentes multilingües para tu sitio web: selecciones gratuitas por script

Resume este post con: 9 minutos de lectura

ChatGPT Perplejidad Grok Inteligencia artificial de Google

No existe una única fuente web que cubra bien todos los idiomas. Lo más parecido es Google Noto proyecto, que cubre “más de 1.000 idiomas y más de 150 sistemas de escritura”, pero se envía como familias separadas por escritura. Para la mayoría de los sitios web multilingües, la respuesta práctica es una fuente principal para texto en latín, cirílico y griego, además de un recurso alternativo específico para la escritura (Noto o una familia correspondiente) para árabe, hebreo, devanagari, tailandés y CJK.

A continuación se muestran 12 fuentes gratuitas que manejan más de un script, con los scripts exactos que cada una admite, seguidos de una configuración CSS y una rutina de prueba que puede ejecutar antes de iniciar un nuevo idioma.

Conclusiones clave

• Check scripts, no “número de idiomas”. Si una fuente no tiene glifos árabes, no importa cuántos idiomas con escritura latina incluya.
• Los glifos faltantes aparecen como cuadros vacíos (“tofu”) o como una fuente del sistema no coincidente. Ambos parecen rotos para los lectores nativos.
• Construye un pila de fuentes: primero la fuente de su marca, luego una fuente específica del script y luego una familia genérica. El navegador selecciona por personaje.
• Cargue CJK y otras fuentes grandes solo cuando sea necesario. Google Fonts ya los divide en pequeños unicode-range Rebanadas.
• Pruebe cada idioma en páginas reales, en tamaños reales, antes de activarlo para los visitantes.

Cómo elegimos y verificamos estas fuentes

Las 12 fuentes son de uso gratuito y están disponibles en Google Fonts. La cobertura de script indicada para cada uno proviene de los metadatos de la familia Google Fonts, verificados el 27 de septiembre de 2026. “Latín” incluye el conjunto latino ampliado que cubre la mayoría de los idiomas europeos, donde se enumeran el turco y el vietnamita.

Omitimos las fuentes premium. Las familias pagas como Helvetica World o Frutiger pueden ser excelentes, pero su soporte lingüístico y sus precios cambian según la licencia y el proveedor, y debes consultarlos directamente con la fundición.

Las 12 fuentes multilingües

1. Noto Sans

Guiones: Latín, cirílico, griego, devanagari, vietnamita. Las familias acompañantes cubren casi todo lo demás: Noto Sans árabe, hebreo, tailandés, JP, KR, SC (chino simplificado), TC (chino tradicional) y más.

Noto (abreviatura de “sin tofu”) es la opción predeterminada cuando necesitas amplitud. El Proyecto Noto lo describe como una colección “en más de 1000 idiomas y más de 150 sistemas de escritura” y las fuentes se publican bajo la licencia SIL Open Font. Debido a que cada familia de scripts está diseñada para funcionar en conjunto, Noto también es el recurso alternativo más seguro detrás de cualquier otra fuente de esta lista.

2. Noto Serif

Guiones: Latín, cirílico, griego, vietnamita, además de símbolos matemáticos.

El socio serif de Noto Sans, con su propio conjunto de compañeros de escritura (Noto Serif JP, Noto Naskh Arab para un estilo árabe tradicional y otros). Bueno para sitios editoriales que desean una sensación similar a la de un libro en todos los idiomas.

3. Abierto Sans

Guiones: Latín, cirílico, griego, Hebreo, vietnamita.

Humanist sans de Steve Matteson ha sido un elemento básico de la web durante años. Su soporte hebreo es la razón por la que está en esta lista: pocas fuentes latinas populares lo incluyen. Es una opción sólida de cuerpo de texto para sitios que necesitan inglés, ruso, griego y hebreo de una familia.

4. Roboto

Guiones: Latín, cirílico, griego, vietnamita.

Fuente del sistema Android, diseñada por Christian Robertson. Los visitantes ya lo saben, tiene muchos pesos y una versión variable, y se empareja limpiamente con Noto para scripts que no cubre.

5. Inter

Guiones: Latín, cirílico, griego, vietnamita.

Rasmus Andersson diseñó Inter para pantallas y muestra en pequeño texto de interfaz de usuario: botones, etiquetas, tablas. Si su sitio es una aplicación o un panel de control, las alternativas de Inter plus Noto son una combinación sólida.

6. Fuente Sans 3

Guiones: Latín, cirílico, griego, vietnamita.

La primera familia de código abierto de Adobe, por Paul D. Hunt. Neutral, muy legible en texto largo y con una estrecha coincidencia estilística con Source Han Sans, el diseño CJK que Adobe desarrolló con Google y que Google envía como Noto Sans CJK.

7. Fira Sans

Guiones: Latín, cirílico, griego, vietnamita.

Diseñado por Carrois Apostrophe para Mozilla. Un poco más de personalidad que Roboto o Inter, con un Fira Mono a juego si tu sitio muestra código.

8. Montserrat

Guiones: Latín, cirílico, vietnamita. No griego.

Popular para encabezados. Está aquí como recordatorio para leer la línea de cobertura: Montserrat funciona para inglés, alemán, polaco, ruso y ucraniano, pero una página griega volvería a otra fuente a mitad del título.

9. IBM Plex Sans (y sus compañeros de script)

Guiones: Plex Sans cubre latín, cirílico, griego y vietnamita. Se añaden familias separadas Árabe, hebreo, devanagari, tailandés, japonés y coreano.

IBM Plex es la opción más completa “diseñada como un solo sistema” después de Noto. Cada compañero comparte las proporciones y el tono de Plex, por lo que una página en árabe y una página en inglés parecen la misma marca.

10. Rubik

Guiones: Latín, cirílico, Hebreo, árabe.

Ligeramente redondeado y amigable. Una de las pocas familias solteras que abarca tanto el hebreo como el árabe, junto con el latín y el cirílico, lo que la hace útil para los sitios de Oriente Medio.

11. El Cairo

Guiones: Árabe, latín.

Una familia árabe contemporánea con un conjunto latino a juego. Útil cuando sus páginas en árabe son la prioridad y desea que las palabras en inglés dentro del texto en árabe (nombres de marcas, códigos de productos) coincidan.

12. Noto Sans JP, SC, TC y KR

Guiones: Japonés, chino simplificado, chino tradicional y coreano respectivamente, cada uno con latín y cirílico.

Las fuentes chinas, japonesas y coreanas contienen miles de caracteres, por lo que el verdadero problema es el tamaño del archivo. Google Fonts los sirve en pequeñas cantidades unicode-range fragmentos, y el navegador solo descarga los fragmentos que necesita una página. Utilice la familia que coincida con el idioma: el japonés y el chino comparten muchos caracteres pero los dibujan de manera diferente y los lectores lo notan.

Una advertencia rápida sobre los favoritos exclusivos para latinos: Lato, por ejemplo, enumera sólo latín y latín extendido en Google Fonts. Muchas fuentes de marca son iguales. Eso está bien, siempre y cuando tu pila tenga un respaldo para cada otro script que publiques.

Cómo configurar una pila de fuentes multilingüe

El navegador elige una fuente por carácter. Si la primera fuente en font-family no tiene glifo, intenta el siguiente. Puedes usarlo a propósito:

body {
  font-family: 'Inter', 'Noto Sans', 'Noto Sans Arabic', 'Noto Sans JP', system-ui, sans-serif;
}

Para un mejor control, configure fuentes por idioma con el :lang() selector. Funciona siempre que la página <html lang="…"> El atributo es correcto para el idioma que se muestra:

:lang(ar) body {
  font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif;
}
:lang(he) body {
  font-family: 'Open Sans', 'Noto Sans Hebrew', sans-serif;
}
:lang(ja) body {
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1.8;
}
:lang(th) body {
  font-family: 'IBM Plex Sans Thai', 'Noto Sans Thai', sans-serif;
  line-height: 1.9;
}

Tres detalles que ahorran tiempo más adelante:

• Altura de la línea. El tailandés, el devanagari y el árabe tienen marcas encima y debajo de las letras. Una altura de línea ajustada al inglés puede recortarlos. Dale más espacio a esos idiomas.
• Negrita y cursiva. Muchos guiones no tienen cursiva verdadera. Si confía en la cursiva para enfatizar, elija un estilo diferente (peso o color) para esos idiomas.
• Autohospedaje. Si aloja las fuentes usted mismo, conserve las unicode-range descriptores cuando copias @font-face reglas. El Referencia MDN para rango Unicode muestra la sintaxis.

Cómo probar fuentes antes de iniciar un idioma

1. Encienda el idioma en un estado oculto o de preparación y carga tus cinco páginas más importantes: casa, una página de producto o precios, un artículo largo, un formulario y el pago o registro.
2. Busque tofu y cambio de fuente. Los rectángulos vacíos son obvios. Un cambio repentino en la forma de las letras a mitad de un encabezado es más fácil de pasar por alto y significa que la fuente retrocedió.
3. Revisar texto pequeño. Pie de página, etiquetas de formulario, celdas de tabla y botones en tamaño móvil. Los guiones complejos se vuelven difíciles de leer por debajo del tamaño que funciona para el inglés.
4. Compruebe la longitud del texto. El texto traducido suele ser más largo. Los W3C Artículo sobre el tamaño del texto traducido cita la guía de IBM que establece que las cadenas cortas en inglés (hasta 10 caracteres) pueden crecer entre un 200 y un 300% en los idiomas europeos. Los botones y menús se rompen primero.
5. Comprobar dirección. Para árabe, hebreo y persa, confirme que el diseño refleja correctamente y que los números y las palabras latinas dentro del texto todavía se leen de la manera correcta. Nuestra guía para Diseño RTL cubre el lado del diseño.
6. Pregúntele a un lector nativo. Un hablante fluido detectará un glifo regional incorrecto (común con el chino y el japonés) en segundos.

Cómo ConveyThis ayuda con el paso de prueba

ConveyThis traduce el texto de su sitio y establece la página lang atributo al idioma que se muestra, por lo que :lang() Las reglas anteriores se aplican automáticamente. Puede obtener una vista previa de cada idioma a través del selector de idioma y corregir la redacción incómoda en el Editor visual en la página misma, que es la forma más rápida de detectar una etiqueta de botón que ya no encaja. Si una cadena es demasiado larga para su diseño, edite la traducción allí o utilice el glosario para que se utilice un término corto de manera consistente.

Lo que ConveyThis no hace es elegir o cargar fuentes por usted. La pila de fuentes permanece en el CSS de tu tema. Los planes y límites lingüísticos están en el página de precios, y ConveyThis admiten 210 idiomas, por lo que vale la pena verificar la cobertura de fuentes antes de agregar un nuevo script.

Preguntas frecuentes

¿Qué fuente admite todos los idiomas? Ningún archivo de fuente lo hace. La familia Noto de Google es la que más se acerca, con una familia separada por script diseñada para trabajar juntos.

¿Qué es “tofu” en las fuentes? El rectángulo vacío que dibuja un navegador cuando la fuente no tiene glifo para un carácter. El nombre de Noto proviene de “no tofu”.

¿Debo utilizar una fuente para cada idioma? Sólo si realmente cubre todos los guiones que publicas. De lo contrario, utilice la fuente de su marca para el texto en latín y alternativas coincidentes para el resto.

¿Las fuentes multilingües ralentizan mi sitio? Pueden hacerlo, especialmente las fuentes CJK. Carga solo los pesos que uses, mantén unicode-range subconjuntos y uso font-display: swap entonces el texto se muestra mientras se cargan las fuentes.

¿Estás listo para ver tu sitio en un nuevo idioma, fuentes y todo? Crea una cuenta ConveyThis y obtenga una vista previa de las traducciones en sus propias páginas antes de publicarlas.