Gestionar perfiles de color en archivos de diseño

Antes de empezar

Quién puede utilizar esta función

Está disponible en todos los planes.

Está disponible en Figma Design en la aplicación para navegador y para escritorio.

Se necesita permiso can edit al archivo.

Los distintos monitores emplean tecnologías distintas para representar el color, lo que puede hacer que se muestren colores diferentes en función del dispositivo, del monitor, del navegador y de la aplicación. A medida que el equipo crezca, también lo harán las diferencias. 

La gestión de colores en Figma te permite:

• Mantener un color uniforme incluso aunque los distintos miembros del equipo utilicen distintos monitores.
• Elegir el perfil de color preferido para los nuevos archivos de diseño que se creen.
• Cambiar los colores de un archivo de un perfil de color a otro.
• Exportar activos a un perfil de color específico.

Perfiles de color admitidos

En Figma Design, hay disponibles dos perfiles de color: sRGB y Display P3.

sRGB es el perfil de color que se utiliza de forma más frecuente. Ha sido el estándar en la web durante mucho tiempo y lo admiten la mayorías de los navegadores web y monitores.

Display P3, también conocido como P3, tiene colores más vivos y ofrece una representación de los colores un 49 % más diferenciada que sRGB. Si bien aún no es el estándar en los navegadores web y monitores, cada vez se usa más. Si estás diseñando para dispositivos iOS o pantallas con alta definición de píxeles, Display P3 es la opción recomendada para esos casos.

Para obtener los mejores resultados posibles, asegúrate de que el monitor que utilices esté configurado con el perfil de color seleccionado. Por ejemplo, los colores de Display P3 no se representarán con el color adecuado en aquellos monitores que no admitan ese perfil.

Los paneles de FigJam se representan en sRGB.

Seleccionar el perfil de color preferido

Por defecto, los archivos de diseño nuevos se configuran como sRGB. Si deseas seleccionar otro perfil de color para los archivos de diseño que crees:

1. Abre cualquier archivo al que tengas acceso.
2. Abre el menú Figma.
3. Ve a Preferences > Color profile.
4. En el modal Color profile settings, selecciona sRGB o Display P3.
5. Haz clic en la para cerrar el modal y guardar la configuración.

Cambiar el perfil de color de un archivo

Los perfiles de color pueden cambiarse a nivel de archivo. Al cambiar el perfil de color de un archivo, puedes elegir una de estas dos opciones:

• Keep color values (Assign) para cambiar el aspecto de los colores, pero no sus valores.
• Keep appearance (Convert) para cambiar los valores de los colores, pero no su aspecto.

Keep color values (Assign)

Al asignar un perfil de color a un archivo, los colores cambian de aspecto, pero sus datos subyacentes, como los códigos hexadecimales o los valores HSB, no cambian.

Puedes optar por conservar los valores de color al trabajar con colores específicos, como los colores de tu rama. En este caso, es más importante que los códigos hexadecimales de la rama se mantengan iguales en los distintos dispositivos y archivos, incluso aunque el color tenga un aspecto un poco diferente.

Para asignar un perfil de color a un archivo:

1. Con el archivo abierto, haz clic en junto al nombre del archivo.
2. Ve a File color profile > Change to Display P3 o a Change to sRGB.
3. En el modal, elige Keep color values (Assign).
4. Para guardar los cambios, haz clic en Assign Display P3 o en Assign sRGB.

Keep appearance (Convert)

Al convertir un archivo a otro perfil de color, los datos subyacentes de los colores cambiarán, pero tendrán el mismo aspecto o un aspecto lo más similar posible.

Puedes optar por conservar el aspecto de los colores si tu prioridad es la lluvia de ideas, la creación de esquemas de página o probar cómo se muestran los colores en los distintos dispositivos. En estos casos, un aspecto uniforme es más importante que mantener un sistema.

Para convertir un archivo a otro perfil de color:

1. Con el archivo abierto, haz clic en junto al nombre del archivo.
2. Ve a File color profile > Change to Display P3 o a Change to sRGB.
3. En el modal, elige Keep appearance (Convert).
4. Para guardar los cambios, haz clic en Convert to Display P3 o en Convert to sRGB.

Ni los estilos de color ni las variables de color se ven afectados por la conversión, por lo que sus valores de color no cambian.

Deshacer un cambio de perfil de color

Para deshacer un cambio de perfil de color en un archivo, selecciona uno de estos métodos:

• Utilizar los atajos de teclado ⌘ Comando / Control Z.
• Seleccionar una versión anterior del historial de versiones.

Asignar un perfil de color a un archivo heredado

La opción Unmanaged no está disponible desde agosto de 2023. Los archivos de diseño anteriores que estuvieran configurados como no gestionados no tendrán un perfil de color especificado, y se configurarán como Same as preferred profile (preferred color profile). Si no tienes definido un perfil de color preferido, este archivo heredado se mostrará en formato sRGB.

Para asignar un perfil de color a un archivo heredado:

1. Con el archivo abierto, haz clic en la junto al nombre del archivo.
2. Ve a File color profile > Assign to sRGB o a Assign to Display P3.

Cuando hayas asignado un perfil de color, conseguirás permiso de acceso para convertir el archivo a otro perfil de color distinto, pero no podrás volver a la opción Same as preferred profile.

Exportar activos

Por defecto, Figma exporta los activos con el perfil de color del archivo. Sin embargo, puedes elegir otro perfil de color cuando lleves a cabo la exportación. Más información sobre cómo exportar activos en un perfil de color →