• Saltar a la navegación principal
  • Saltar al contenido principal

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Vibe coding
  • Product Design
  • Design system
  • Tutoriales de Figma
  • Blog
  • Newsletter
Figma / Cómo instalar fuentes en Figma

Cómo instalar fuentes en Figma

Mientras hacía las primeras pruebas con la aplicación me pregunté cómo instalar fuentes en Figma. La duda era razonable porque podía tener la necesidad de usar fuentes personalizadas, tipos de letra que no estén dentro de las opciones que la app ofrece por defecto.

cómo instalar fuentes en figma
Foto: Amador Loureiro / Unsplash

Veamos entonces cómo diseñar nuestros sitios web y apps con estilo.

Índice del artículo

Toggle
  • Fuentes de Figma
  • Fuentes personalizadas
  • Figma Font Helper
  • Figma en tu escritorio
  • Fuentes perdidas
    • Más trucos sobre Figma
  • Artículos relacionados
    • Cómo crear variables en Figma con Claude Code
    • IA y Figma en 2026: vibe coding, agentes y un botón
    • Vibe coding con Qwen: no pierdas el control de tu backlog

Fuentes de Figma

Las fuentes que vienen “instaladas” en Figma son muchas de las que puedes encontrar en el catálogo de fuentes de Google (Google Web Fonts).

Yo creo que las fuentes de Figma cubren prácticamente todas las necesidades de los diseñadores UX / UI, pero siempre hay casos puntuales. En algún momento nos veremos trabajando en un proyecto que tenga una fuente comprada, una Premium o una diseñada a medida. En esos casos usaremos Figma con fuentes personalizadas.

Fuentes personalizadas

Para usar tipos de letra especiales siempre vamos a instalar las fuentes en nuestro sistema operativo. Podemos hacerlo de muchas formas:

  • Utilizando el gestor de fuentes del propio sistema: Catálogo Tipográfico en macOS o la Lista de fuentes de Windows 10.
  • Instalar fuentes en un gestor externo como Suitcase Fusion, Typeface, RightFont, FontExplorer X, FontExpert, FontBase o NexusFont. Hay muchos más, pero estos son los más utilizados en ordenadores Mac o con el sistema operativo de Microsoft.

Hablemos de los dos escenarios en los que un usuario de Figma puede trabajar: utilizar la aplicación en el navegador web o instalar la app de escritorio.

Figma Font Helper

Si usamos Figma en browsers como Google Chrome, Safari, Mozilla Firefox, etc, tendremos que “conectar” a Figma con las fuentes que hemos instalado en nuestro ordenador (o computadora).

Para hacerlo vamos a utilizar la aplicación Figma Font Helper, esta app es gratuita.

  • Se ejecutará en segundo plano cuando abras una sesión de Figma en tu navegador.
  • Si utilizas mucho la aplicación, la puedes incluir en la lista de aplicaciones que se ejecutan automáticamente al encender tu computadora u ordenador.

La puedes conseguir en la sección Fuentes de la configuración de tu cuenta. Pero si quieres ir más rápido te dejo un link para descargar Figma Font Helper.

Algunos lectores me han dicho que Figma Font Helper no detecta las fuentes instaladas en el sistema. Eso podría ocurrir por estar usando Figma Font Helper en un sistema operativo para el que no se ofrece soporte. Recomiendo entonces comprobar siempre los requerimientos mínimos.

No me quiero olvidar de Adobe Fonts, los diseñadores que usan las fuentes de Adobe (antes conocido como Adobe Typekit) también necesitan instalar Figma Font Helper.

Si en algún momento necesitas desinstalar Figma Font Helper te recomiendo borrar la aplicación con el programa desinstalador que también encontrarás en la configuración de tu cuenta.

Figma en tu escritorio

Si como yo utilizas la aplicación de escritorio de Figma, tanto la versión de Mac como la de Windows, no necesitas instalar Figma Font Helper. La aplicación desktop se encargará de conectar Figma con tus fuentes personalizadas.

Fuentes perdidas

Cuando abras un archivo de Figma en el que uses fuentes a medida y por alguna razón la aplicación no las encuentre, te mostrará una ventana de aviso. En ella verás una lista con las familias y los estilos de las fuentes perdidas.

Deberás entonces comprobar si las fuentes están instaladas en tus sistema, si necesitas ejecutar tu gestor de fuentes o el Figma Font Helper. Desde la misma ventana podrás también reemplazarlas por otras.

Ya sabemos cómo instalar o añadir fuentes a Figma. Si todavía tienes dudas o necesitas hacer una pregunta puntual por favor deja un comentario, te responderé rápidamente.

Muchas gracias.

Más trucos sobre Figma

Si te interesan los tips de Figma te dejo dos enlaces a los siguientes artículos:

  • Guía de herramientas de Figma más completa 100% en idioma español.
  • Aprende a usar la mejor herramienta para diseño UX y UI
  • Monta diseños y prototipos en Figma como un profesional

Artículos relacionados

Cómo crear Variables de Figma con Claude Code

Cómo crear variables en Figma con Claude Code

Te dejo el prompt que usé y lo que tuve que ajustar.

Cursor, Claude y Figma

IA y Figma en 2026: vibe coding, agentes y un botón

Dónde estoy yo en todo esto y dónde estás tú.

cómo hacer vibe coding con qwen

Vibe coding con Qwen: no pierdas el control de tu backlog

Markdown + Qwen + validación (Método práctico)

Aprende sobre UX/UI + IA, Figma y Product Design

📣 Apúntate a mi newsletter semanal

🔥 Únete a la comunidad UX y UI fácil en Discord

🔴 Suscríbete al canal de YouTube para ver tutoriales

Acerca de Juanpol

Diseñando desde 1993 y todavía aprendiendo. Actualmente como Product Designer en Freepik, aquí comparto mis notas sobre lo que voy probando de UX/UI e IA.

Juanpol

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Acerca de
  • info@juanpol.com
  • LinkedIn
  • GitHub
  • YouTube
  • Discord
  • Telegram
  • X | @juanpol

  • Aviso legal, Privacidad y Cookies

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

Política de cookies

Más información sobre nuestra política de cookies.