Por qué tus fotos salen desvaídas al subirlas

Editas la foto de un producto, el rojo coincide con el jersey de verdad, la subes a tu tienda — y el rojo vuelve convertido en ladrillo. Los verdes tiran a oliva. Abre el original en la misma pantalla: sigue perfecto.

Eso no es compresión, y la plataforma no está "arruinando" tus imágenes. La causa habitual es un desajuste de perfil de color: el archivo describe sus colores en un idioma y la página lee esos números en otro distinto.

Por qué los mismos números producen dos colores distintos

Un píxel son tres números, y 200, 40, 40 es un rojo concreto solo cuando sabes qué espacio de color lo mide. Display P3 lleva el primario rojo más lejos que sRGB (x 0,68 frente a 0,64), así que el mismo trío describe un rojo más profundo. Adobe RGB (1998) mantiene exactamente los primarios rojo y azul de sRGB y estira en cambio el verde, así que su alcance extra está en los verdes y los cianes. En cualquier caso, los números significan algo distinto para un navegador que da por hecho sRGB.

El perfil es la nota que dice qué regla se usó, y la web toma una decisión tajante cuando esa nota falta. El módulo CSS Color Level 4 es explícito: por compatibilidad, los colores especificados en HTML y las imágenes sin etiquetar deben tratarse como pertenecientes al espacio de color sRGB, salvo que se indique otra cosa. Tu subida sin etiquetar nunca indica otra cosa, así que sRGB será.

Así que si tu archivo se exportó en Adobe RGB o Display P3 y el perfil se pierde por el camino — un flujo que recodifica, un conversor que elimina los metadatos —, esos números de gama amplia se leen como sRGB. Apretados dentro de una suposición más estrecha, salen desaturados: ese es el aspecto desvaído del que hablamos. Qué colores sufren depende del origen: un archivo Adobe RGB malinterpretado como sRGB pierde fuerza en verdes y cianes, mientras que uno en Display P3 además apaga los rojos saturados. Los neutros apenas se mueven: nada en un packshot gris, un desastre en un bañador coral.

Confirma que es el archivo, no tu pantalla

Pon el original y la subida uno al lado del otro en una misma ventana del navegador.

• Correcto en tu editor, apagado en el navegador: problema de perfil.
• Idéntico en el navegador pero distinto de lo que ves en tu editor: tu editor está previsualizando en un espacio de trabajo que el navegador ignora.
• Mal solo en tu móvil o en el portátil de un compañero: diferencia de pantalla, no del archivo.

Después arrastra el original a una pestaña del navegador: los navegadores respetan un perfil incrustado. Si el archivo local se ve bien y la subida no, la ruta de subida descartó la etiqueta.

Averigua qué perfil lleva el archivo

• macOS: abre el archivo en Vista Previa y haz clic en el botón de información de la barra de herramientas (o pulsa Comando-I), y luego mira la pestaña Más información, que lista el perfil de color de la imagen.
• Photoshop: haz clic en la flecha de la barra de estado del documento y elige Perfil del documento.
• Lightroom: el desplegable Espacio de color del cuadro de diálogo de exportación es lo que realmente enviaste.
• Cualquier programa, cualquier plataforma: ExifTool lo imprime — exiftool -ProfileDescription photo.jpg.

Para la web, cualquier cosa que no sea sRGB es sospechosa. Los iPhone recientes capturan las fotos en color amplio y etiquetan el archivo en consecuencia: Apple menciona la "captura de color amplio para fotos y Live Photos" en las especificaciones de la cámara. Algunos móviles Android ofrecen también una opción de captura de gama amplia, así que comprueba el archivo.

Convierte a sRGB: ni eliminar ni asignar

Tres operaciones que suenan parecidas hacen cosas muy distintas.

• Eliminar quita la etiqueta y deja los números tal cual: datos de gama amplia que ahora se leerán como sRGB con total seguridad, lo que empeora las cosas.
• Asignar vuelve a etiquetar sin recalcular, lo que cambia el aspecto, normalmente a algo equivocado.
• Convertir recalcula cada píxel para que el color se mantenga tan cerca como permita el espacio más pequeño, y después adjunta la etiqueta sRGB.

Convertir es la que quieres: Edición › Convertir en perfil en Photoshop, o el Espacio de color de la exportación de Lightroom puesto en sRGB. Cuenta con que tus colores más saturados se desplacen ligeramente.

El caso inverso: capturas de pantalla demasiado vivas

El mismo mecanismo, en dirección contraria. Una captura hecha en una pantalla de gama amplia registra los valores de color en el espacio de esa pantalla. Las capturas tomadas en macOS suelen guardarse con el perfil de la pantalla adjunto; otras herramientas de captura puede que no adjunten ninguno. Leídos de vuelta como sRGB, esos mismos números se muestran más saturados de lo que viste: verdes de neón, piel quemada por el sol. La solución es la misma.

Por qué esto importa cuando reemplazas el fondo

Aquí un perfil desajustado deja de ser sutil. Coloca un recorte sobre el color de tu marca en remover.bg y pon después esa imagen en una página junto a un bloque del mismo hexadecimal definido en CSS: el color del CSS se muestra como sRGB.

Si la imagen lleva una etiqueta distinta, dos tonos de un mismo color quedan uno junto al otro y se niegan a coincidir. Convertir a sRGB antes de subir elimina la ambigüedad en el origen.

El blanco puro sobrevive a la conversión sin cambios, así que un desajuste por sí solo no te hará suspender un control de fondo blanco de marketplace: lo que sufre son los colores del producto. Y el formato no te salva: PNG, JPEG y WebP llevan todos perfiles, y todos se leen mal cuando la etiqueta desaparece, incluidos los recortes transparentes.

Antes de tu próxima subida

Fija el espacio de color de exportación en sRGB una sola vez, en el preset que usas de verdad, y el problema deja de repetirse. Después compara a modo de control una subida con el original en una misma pantalla: si los colores aguantan, tu flujo está limpio.