Extraer paleta de colores de una imagen
Para extraer colores de una imagen, suelta una foto, un logo o una captura: obtienes sus 5 a 8 colores principales con los códigos HEX y RGB listos para copiar. Prueba el contraste entre dos de ellos antes de usarlos en texto y descarga una tarjeta de la paleta con tu imagen y las muestras. La imagen no sale de tu navegador.
- Gratis
- Sin registro
- Funciona en tu navegador
Tus imágenes se quedan en este dispositivo. No se sube nada: todo ocurre en tu navegador.
Paleta
Agrega una imagen para ver sus colores.
Nuestro generador de códigos QR gratis acepta un código HEX para el código y otro para el fondo.
Abrir el generador de códigos QR¿Vas a publicar con esta paleta? Reúne todos tus enlaces en una página. Crea tu VISU Link gratis
Contraste entre dos colores
Elige un color para el texto y otro para el fondo y mira si la pareja se lee bien.
Relación de contraste
- AA
- AAA
- AA
- AAA
WCAG 2.x pide 4,5:1 para texto normal y 3:1 para texto grande (nivel AA), y 7:1 y 4,5:1 en el nivel AAA. El texto grande empieza en 24 px, o en 18,66 px en negrita. Fórmula y umbrales: W3C, WCAG 2.2
La paleta hace que tu perfil se vea como una marca. El enlace de tu bio completa el trabajo.
VISU Link es una página gratis en visu.to/tunombre para tu tienda, reservas, menú, contactos y redes sociales. Una sola dirección para tu bio, tus publicaciones y tu código QR, y cambias lo que hay detrás cuando quieras.
Crear mi VISU Link Conocer VISU LinkCómo usarla
- Suelta una imagen, elígela en tu dispositivo o pégala. Sirven fotos, logos, fotos de producto y capturas de pantalla.
- Elige cuántos colores quieres, de 5 a 8. La paleta llega ordenada según cuánto de la imagen ocupa cada color.
- Copia un código, la lista completa o las variables CSS. Después elige un color de texto y uno de fondo para ver la relación de contraste y las marcas AA y AAA.
- Descarga la tarjeta de la paleta en PNG para guardarla con los archivos de tu marca o enviarla a quien diseña contigo.
Ejemplos
Colores de marca a partir del logo
Suelta el PNG de tu logo y copia sus colores en HEX. Un área de color plano conserva su color real, así que el código que copias es el que usó el diseñador, y el fondo transparente se ignora.
Un feed que combina con la foto del producto
Toma tu mejor foto del producto, extrae 6 colores y úsalos en los fondos y los textos de tus próximas publicaciones e historias.
Texto legible sobre un color
Elige el azul oscuro de la paleta como fondo y el crema como texto. Si la relación es de 4,5:1 o más, la pareja cumple el nivel AA para texto normal.
Preguntas
¿Mi imagen se sube a algún sitio?
No. La página carga una vez y después el navegador lee los píxeles en tu dispositivo. La imagen no se envía a ningún servidor, no hace falta cuenta y la tarjeta de la paleta también se dibuja en tu dispositivo. Puedes comprobarlo: abre la pestaña de red de las herramientas del navegador y suelta una imagen. No sale ninguna solicitud.
¿Cómo se eligen los colores?
La herramienta lee una copia pequeña de la imagen y agrupa sus píxeles por color, un método conocido como corte mediano (median cut). Los grupos casi iguales se unen, y el resultado se ordena según cuánto de la imagen ocupa cada color. La misma imagen siempre da la misma paleta.
¿Por qué salieron menos colores de los que pedí?
Porque la imagen no tiene tantos colores bien distintos entre sí. Un logo de dos colores da dos colores. La herramienta nunca inventa tonos para llegar al número.
¿Qué significa la relación de contraste?
Es la medida de WCAG para la diferencia de brillo entre dos colores, de 1:1 (el mismo color) a 21:1 (negro sobre blanco). El texto normal necesita 4,5:1 para el nivel AA y 7:1 para el AAA. El texto grande, desde 24 px o 18,66 px en negrita, necesita 3:1 para el AA y 4,5:1 para el AAA.
¿Qué formatos de imagen sirven?
JPG, PNG, WebP, GIF y AVIF, de hasta 40 MB. Las partes transparentes de un PNG se ignoran, así que un logo con fondo transparente da solo los colores del logo. Una foto HEIC de iPhone hay que exportarla antes como JPG.
¿Puedo usar estos colores en un código QR?
Sí. Abre nuestro generador de códigos QR y escribe los códigos HEX en las opciones de estilo: el color más oscuro para el código y el más claro para el fondo, para que la cámara pueda leerlo. Si el código va impreso, un VISU QR dinámico te deja editar el destino después y muestra el conteo de escaneos.
¿Qué trae la tarjeta de la paleta?
Un PNG de 1080 px de ancho con tu imagen completa arriba y una muestra por color abajo, cada una con sus códigos HEX y RGB. No se añade ningún logo ni marca de agua: la imagen es tuya.