¿Qué son las variables de Figma?
Las variables de Figma son valores con nombre guardados dentro de un archivo de Figma para colores, números, cadenas y booleanos, con modos para casos como el tema claro y oscuro. Son la forma nativa de tokens de diseño en Figma, pero leerlas mediante la API REST de Figma requiere un plan Enterprise.
Qué hacen
Las variables permiten que un archivo de Figma guarde valores con nombre en vez de repetir valores crudos. Admiten cuatro tipos: color, número, cadena y booleano.
Se pueden organizar en colecciones, y cada colección puede tener modos: normalmente claro y oscuro, pero también densidad, marca o plataforma. Una capa vinculada a una variable se actualiza cuando cambia el modo, lo que hace que el theming dentro de Figma funcione como debe.
Las variables también pueden ser alias de otras variables, y así se construye una capa semántica: text/danger apuntando a red/600.
Dónde está la dificultad
Las variables resuelven el problema dentro de Figma. El problema fuera de Figma queda sin resolver, y aquí es donde los equipos se llevan la sorpresa.
Leer variables por la API REST de Figma requiere un plan Enterprise. El endpoint existe, y devuelve 403 en los planes Professional y Organization.
La consecuencia práctica es importante al evaluar herramientas. Cualquier cosa que prometa sincronización de tokens de Figma por la API REST funciona en una cuenta Enterprise y no hace absolutamente nada en el plan que tiene la mayoría de equipos. Conviene preguntarlo directamente antes de comprar, porque no suele aparecer en el material de marketing.
Los plugins no se ven afectados. La API de plugins lee las variables desde dentro del archivo, y un plugin funciona en cualquier plan. Una herramienta cuyo transporte es un plugin funciona con independencia de tu nivel de Figma.
Variables y tokens de diseño
Las variables de Figma son una forma de token de diseño, acotada a Figma. Por sí solas no son portables: no hay exportación integrada a CSS, a Tailwind ni al formato JSON de tokens del W3C.
Salvar esa distancia es para lo que sirven las herramientas de tokens. La elección está entre un plugin, que funciona en todas partes, y la API REST, que no.
Dónde encaja Flash DSM
Flash DSM usa un plugin de Figma como transporte exactamente por este motivo. Lee variables en cualquier plan de Figma, convierte una publicación en un diff de tokens revisable y exporta a CSS, Tailwind, Tokens Studio JSON o un pull request de GitHub.