Trabajar con estilos en Figma te permite crear paletas de colores, tipografías, sombras y espaciados reutilizables que se actualizan en cascada cuando cambias una variable. Esta guía es para diseñadores que quieren escalar sus sistemas de diseño usando estilos globales y librerías compartidas, incluso si no tienen cuenta pro.

¿Dónde se gestionan los estilos globales en Figma?

Los estilos globales viven en la barra lateral derecha del canvas, y solo aparecen cuando no tienes ningún elemento seleccionado. Es el primer truco que conviene memorizar.

Si seleccionas una paleta de colores o un frame, la barra cambia y muestra propiedades específicas de ese elemento. Pero si haces clic en un área vacía del canvas, Figma despliega todos los estilos disponibles a nivel de archivo: colores, textos, efectos y rejillas [01:30].

¿Qué son los estilos a nivel de archivo en Figma? Son variables de color, texto o efectos guardadas dentro de un archivo, accesibles desde cualquier elemento de ese archivo y reutilizables como si fueran componentes.

¿Cómo creo y organizo un estilo de color en Figma?

Para crear un estilo nuevo, eliges un color desde el panel hexadecimal y haces clic en los cuatro puntitos junto a la propiedad. Pulsas el botón + y le pones nombre.

La magia está en cómo nombras: si escribes brand/success, Figma interpreta el slash como una jerarquía y crea automáticamente una carpeta llamada brand con el estilo success dentro [02:45]. Esta nomenclatura es clave para mantener orden cuando tu sistema crece.

¿Puedo mover estilos entre carpetas o archivos?

Sí, y de dos formas distintas:

• Arrastrando el estilo con drag and drop hacia otra carpeta dentro del mismo archivo.
• Usando cut style con clic derecho, abriendo un archivo nuevo y haciendo paste here. La jerarquía de carpetas se respeta intacta.

Una vez pegado el estilo en otro archivo, queda disponible como variable. Si pintas un frame con ese color y luego decides cambiar el hexadecimal desde el panel de estilos, todos los elementos que usen esa variable se actualizan automáticamente [04:10]. Es la lógica de los componentes aplicada al color.

¿Cómo publico una librería compartida en Figma?

Una librería compartida convierte tus estilos y componentes en recursos disponibles para todo el equipo, no solo para un archivo. Aquí es donde Figma se vuelve potente para sistemas de diseño.

Para publicarla, ve al panel de assets o accede desde el icono de team library. También puedes entrar por el menú principal: file, view, text, arrange, vector y dentro de libraries [05:30]. Verás el nombre del archivo y un CTA que dice publish.

Al pulsar publicar, Figma te muestra todos los componentes y estilos creados. Puedes:

• Deschequear los que no quieras incluir en la librería.
• Añadir un punto y un slash antes del nombre del componente para excluirlo, como un gitignore en desarrollo.
• Escribir una nota de versión, por ejemplo primera versión de nuestra librería, que queda guardada como punto de referencia.

¿Qué pasa si cambio un color en una librería ya publicada? El cambio se replica en todos los archivos donde esa librería esté attachada. Si tu botón primario era azul y lo pasas a verde, todos los botones que usan esa variable cambian sin que toques cada archivo.

¿Cómo evito que alguien rompa la librería compartida?

Figma permite controlar permisos desde los settings, así que decides quién puede editar la librería y quién solo consumirla. No tengas miedo de compartir: la gobernanza está cubierta.

Esta lógica de variables centralizadas es lo que permite escalar un sistema de diseño sin caos. Cambias el color de marca una vez y la marca cambia en todos los productos donde esa librería vive.

¿Y si no tengo cuenta pro de Figma?

Aunque las librerías compartidas son una funcionalidad pro, puedes usar el truco de cut style y paste here entre archivos para mover estilos manualmente. No es tan automático, pero te da una base de consistencia entre proyectos [03:50].

En la próxima sesión vas a iterar la card que ya construimos y crear sus variantes para tener un componente mucho más complejo. ¿Tú cómo organizas tu nomenclatura de estilos en Figma? Cuéntamelo en los comentarios.