Stylepack

Fuentes

Las fuentes que usa figma.com

figma.com compone sus titulares y su texto de cuerpo en figmaSans. figmaSans es una fuente con licencia que el sitio sirve por su cuenta. La alternativa gratuita más parecida en Google Fonts: Inter.

Medido en figma.com hace 4 días.

Abrir el paquete de diseño completoDescargar el paquete

Familias tipográficas

2 familias
figmaSans
Se usa para
h1, h2, h3, body, button, label
Origen
Autoalojada
Alternativa gratuita
Inter
figmaMono
Se usa para
label
Origen
Autoalojada
Alternativa gratuita
Inter

CSS para reproducirlo

Variables de fuente con la alternativa gratuita en la pila, así el mismo CSS funciona con o sin la fuente con licencia.

:root {
  --font-heading: "figmaSans", "Inter", sans-serif; /* Inter stands in for figmaSans */
  --font-body: "figmaSans", "Inter", sans-serif; /* Inter stands in for figmaSans */
  --font-size-base: 30px;
}

Cómo se compone el texto

headline-displayQuick brown foxfigmaSans / 56px / 400 / lh 56px / -1.25px
headline-lgQuick brown foxfigmaSans / 44px / 400 / lh 48.4px / -0.66px
headline-mdQuick brown foxfigmaSans / 16px / 400 / lh 22.4px
body-mdThe quick brown fox jumps over the lazy dogfigmaSans / 30px / 400 / lh 36px / -0.66px
label-mdThe quick brown fox jumps over the lazy dogfigmaSans / 16px / 400 / lh 22.4px
buttonThe quick brown fox jumps over the lazy dogfigmaSans / 16px / 400 / lh 23.2px
Tamaños de fuente en uso
12141618304456

Para agentes de IA

El paquete es texto plano, sin clave: descarga DESIGN.md o entrega el paquete completo a Claude Code, Cursor o Copilot con el servidor MCP.

curl -s https://stylepack.ai/packs/figma.com/DESIGN.md

Preguntas

¿Qué fuente usa figma.com?

figma.com usa figmaSans, figmaMono. Los titulares van en figmaSans y el texto de cuerpo en figmaSans, medido en el sitio tal como se renderiza, no leído de su hoja de estilos.

¿La fuente de figma.com es gratuita?

No. figmaSans es una fuente con licencia que figma.com sirve por su cuenta. La alternativa gratuita más parecida es Inter, disponible en Google Fonts. El CSS de esta página la pone en la pila de fuentes como sustituta.

¿Cómo consigo la misma tipografía que figma.com en mi proyecto?

Descarga el paquete de diseño de figma.com en Stylepack: contiene la pila de fuentes, la escala tipográfica, cada estilo de texto y las capturas, en un formato con el que un agente de programación con IA como Claude Code o Cursor puede construir.