Color · Paleta a partir de una foto
Extrae una paleta de colores de una foto para tus publicaciones en redes sociales
Una buena foto de producto ya contiene una paleta: el fondo, el producto y algunos acentos. Llevar esos colores a tus plantillas de publicaciones hace que todo el feed parezca planificado. El riesgo es elegir colores que quedan bien juntos pero que resultan difíciles de leer como texto.
Esta guía extrae una paleta de la foto de un latte de una cafetería ficticia con GPT-6 Astra en Ciyo el 19 de septiembre de 2026 y después comprueba qué combinaciones son legibles. Volvimos a calcular nosotros mismos las cifras de contraste de Astra.
Elige una foto que represente la marca
Usa una foto que realmente vayas a publicar, con el producto, la luz y el entorno que quieres que la gente recuerde. Nosotros usamos una foto vertical de historia de un latte de miel y lavanda junto a la ventana de una cafetería.
Pide colores con funciones
Una lista de códigos hexadecimales no es una paleta hasta que cada color tiene una función. Pedimos a Astra cinco colores, dónde aparece cada uno en la foto y una función: fondo, texto, acento o botón. También preguntamos qué combinación es la más segura para leer en un teléfono.
Extrae de la foto seleccionada una paleta de cinco colores para las publicaciones en redes sociales de Juniper Lane Café. Para cada color, da un código hexadecimal, dónde aparece en la foto y una función: fondo, texto, acento o botón. Después dime qué combinación de texto sobre fondo es la más segura para leer en un teléfono y señala cualquier combinación que tenga un contraste demasiado bajo. No generes nada.Lee la paleta y sus límites
Astra devolvió crema cálido #F2E3CD para los fondos, marrón espresso #3F3329 para el texto, lavanda empolvado #A995AA y dorado miel #C99C52 como acentos, y verde oliva apagado #686342 para los botones. Dijo que los códigos hexadecimales eran aproximaciones visuales a partir de la vista previa, no valores muestreados píxel a píxel.
Esa nota importa. Si necesitas valores exactos, muestréalos con un cuentagotas en un editor de imágenes y compáralos.
Comprueba el contraste antes de diseñar
Astra señaló el espresso sobre crema como la combinación más segura, con alrededor de 9.7:1, y el crema sobre los botones oliva con alrededor de 4.8:1, por encima del objetivo habitual de 4.5:1 para texto normal. Marcó como demasiado bajos el crema con lavanda o dorado, y el espresso con oliva.
Volvimos a calcular cada combinación con la fórmula de contraste de las WCAG y obtuvimos los mismos resultados salvo por el redondeo. El lavanda y el dorado son acentos, no colores de texto.
| Texto sobre fondo | Relación | ¿Sirve para texto normal? |
|---|---|---|
| Espresso #3F3329 sobre crema #F2E3CD | 9.69:1 | Sí |
| Crema sobre oliva #686342 | 4.82:1 | Sí, para botones |
| Espresso sobre lavanda #A995AA | 4.41:1 | Solo texto grande |
| Crema sobre lavanda | 2.20:1 | No |
| Crema sobre dorado miel #C99C52 | 1.99:1 | No |
Convierte la paleta en una plantilla de publicación
Crea una plantilla con las funciones fijas: fondo crema, titular en espresso, botón oliva, y lavanda o dorado solo para pequeñas formas decorativas. Pon el texto sobre una zona de color liso en lugar de directamente sobre la foto, donde la luz y las sombras cambian el contraste.
Guarda los cinco códigos hexadecimales en tus notas de marca para que la siguiente publicación use los mismos valores.
Compáralo con un método manual
Las herramientas de diseño también pueden muestrear una paleta de una foto. El 19 de septiembre de 2026, @MONABLIZUIUX publicó un breve tutorial sobre cómo crear una paleta de colores a partir de una foto en Adobe Illustrator. Un muestreador manual da valores de píxel exactos; Astra añade funciones y consejos de contraste. Usar ambos es una buena comprobación.
Un videotutorial de Adobe Illustrator; no es una herramienta de IA ni es Ciyo.
Preguntas sobre paletas a partir de fotos
¿Son exactos los códigos hexadecimales de Astra?
No. En nuestra ejecución, Astra dijo que eran aproximaciones visuales a partir de la vista previa. Muestrea la foto con un cuentagotas si necesitas valores exactos.
¿Qué relación de contraste debe cumplir el texto?
Un objetivo habitual es 4.5:1 para texto de tamaño normal. En nuestra paleta, el espresso sobre crema dio 9.69:1.
¿Costó créditos?
La petición de la paleta es un chat con GPT-6 Astra. En nuestra ejecución, los turnos de chat no cambiaron el saldo.
Encuentra tu paleta
Selecciona una foto en Ciyo y pide a GPT-6 Astra cinco colores con funciones y una comprobación de contraste.