Selector de colores de imagen
Sube una imagen, pasa el ratón para ampliarla y haz clic en cualquier píxel para obtener su código de color exacto. Tu imagen nunca sale de tu navegador.
- Privado: funciona en tu navegador
- HEX, RGB, HSL, HSV, CMYK
- Paleta automática
Suelta una imagen aquí
PNG, JPG, WebP, GIF, SVG y más, hasta 25 MB.
También puedes pegar una captura de pantalla con Ctrl+V.
Pasa el ratón (o toca y arrastra) para ver el color; haz clic o levanta el dedo para elegirlo. Con el teclado: las flechas mueven un píxel (Mayús mueve diez) e Intro elige.
Paleta de la imagen
Los 8 colores más representativos de tu imagen.
Carga una imagen para extraer su paleta.
Colores elegidos
Guardados solo en este navegador.
Haz clic en la imagen para guardar colores aquí.
Por qué necesitas el código exacto del color
Tienes un logotipo, una captura de la web de un competidor o una foto de un cliente, y necesitas sus colores para un sitio web, una presentación o un anuncio. Los archivos de diseño originales no aparecen y nadie recuerda qué verde usa realmente la marca. Calcularlo a ojo, o elegir "algo parecido" en un selector de colores, es como la mayoría intenta resolverlo.
Qué pasa cuando los colores se eligen a ojo
Los colores elegidos a ojo casi nunca son correctos. Un botón dos tonos distinto del logotipo hace que un sitio parezca inacabado, y cada página nueva se aleja un poco más de la marca. Los colores de texto elegidos por intuición a menudo no tienen suficiente contraste, lo que dificulta la lectura y puede perjudicar la accesibilidad. Y cuando alguien por fin se da cuenta, hay que corregir de nuevo cada gráfico, hoja de estilos y documento.
Cómo lo resuelve este selector de colores de imagen
- Abre tu imagen. Elige un archivo, arrástralo a la página o pega una captura de pantalla con Ctrl+V (Cmd+V en Mac).
- Amplía con la lupa. Al moverte por la imagen, una lupa muestra los píxeles uno a uno, para que aciertes exactamente con el que quieres, incluso en líneas finas y textos pequeños.
- Haz clic para elegir. El color aparece en HEX, RGB, HSL, HSV y CMYK. Copia cualquier formato con un clic y pégalo en CSS, Figma, Canva, Photoshop o Word.
- Revisa el contraste y las variaciones. Consulta la relación de contraste WCAG con texto blanco y negro, además de tonos más claros y más oscuros para estados hover y fondos.
- Llévate la paleta completa. La herramienta extrae automáticamente los 8 colores principales de la imagen y los copia como variables CSS listas para tu hoja de estilos.
Gratis, privado y sin registro
El selector de colores de imagen es gratis, no tiene límites de uso y no requiere cuenta. Tu propio navegador abre la imagen y nunca se sube a nuestro servidor, lo que lo hace seguro para diseños sin publicar y capturas confidenciales. Se admiten archivos de hasta 25 MB en cualquier formato que tu navegador pueda mostrar; las imágenes muy grandes se reducen a 4096 píxeles en el lado más largo. Los colores que eliges se guardan solo en este navegador, para que puedas volver a ellos más tarde.
Los formatos de color explicados
| Formato | Ejemplo | Dónde se usa |
|---|---|---|
| HEX | #16845B | CSS y HTML, herramientas de diseño, manuales de marca. |
| RGB | rgb(22, 132, 91) | CSS, pantallas, editores de imagen y código. |
| HSL | hsl(158, 71%, 30%) | CSS; facilita crear variantes más claras u oscuras cambiando la luminosidad. |
| HSV / HSB | hsv(158, 83%, 52%) | Selectores de color de Photoshop, Illustrator y muchas aplicaciones. |
| CMYK | cmyk(83%, 0%, 31%, 48%) | Impresión. Nuestro valor es una conversión sencilla sin perfil de color, así que úsalo solo como punto de partida. |
¿Vas a crear o rediseñar un sitio web con estos colores? Cuando esté publicado, asegúrate de que siga en línea: nuestra guía de monitoreo de uptime explica cómo recibir una alerta en cuanto se caiga.
Preguntas frecuentes
¿Cómo obtengo el código de color de una imagen?
Sube la imagen con el botón de arriba, arrástrala a la página o pégala con Ctrl+V. Mueve el puntero sobre la imagen para ver una vista ampliada y haz clic en el píxel que quieras. El color aparece en HEX, RGB, HSL, HSV y CMYK, cada uno con un botón para copiar.
¿Se sube mi imagen a vuestro servidor?
No. Tu propio navegador abre y lee la imagen con el canvas de HTML. Nunca se envía a UptimeStats ni a nadie más, y desaparece cuando cierras o recargas la página.
¿Qué formatos de imagen se admiten?
Cualquier formato que tu navegador pueda mostrar: PNG, JPEG, WebP, GIF, BMP, AVIF y SVG en los navegadores actuales. Se aceptan archivos de hasta 25 MB; las imágenes muy grandes se reducen a 4096 píxeles en el lado más largo antes de seleccionar.
¿Cómo funciona la paleta de la imagen?
La herramienta agrupa los píxeles parecidos (agrupación k-means sobre una copia reducida de la imagen) y muestra los 8 colores más representativos con la parte de la imagen que ocupa cada uno. Es una forma rápida de sacar una combinación de colores de una foto, un logotipo o una captura de pantalla.
¿Los valores CMYK son exactos para imprimir?
Son una conversión matemática desde RGB sin perfil de color: sirven como referencia, pero no para trabajos de impresión profesionales. Para imprimir, convierte el color en tu programa de diseño con el perfil ICC que use tu imprenta.
¿Puedo tomar un color de fuera de la imagen?
En Chrome, Edge y otros navegadores compatibles con la API EyeDropper aparece el botón "Tomar de la pantalla". Con él puedes elegir cualquier color visible en tu pantalla, incluso en otras ventanas.
¿El selector de colores de imagen es gratis?
Sí, totalmente gratis, sin cuenta y sin límite de colores. Los colores que eliges se guardan solo en tu navegador, para que puedas volver a ellos más tarde.
Tu sitio web está listo. ¿Está en línea ahora mismo?
UptimeStats comprueba tu sitio web cada 5 minutos y te envía un correo cuando se confirma una caída. Gratis para hasta 5 sitios web.
Más herramientas gratis
Comprobar si una web está caída
Comprobador gratis del estado de un sitio web: comprueba si una web está caída para todos o solo para ti, con estado HTTP, tiempo de respuesta y motivo del fallo.
Comprobar estado HTTP
Consulta el código de estado HTTP que devuelve una URL, cada redirección por el camino y las cabeceras de respuesta más importantes.
Tiempo de respuesta web
Mide gratis el tiempo de respuesta de tu web. Consulta el tiempo hasta el primer byte y cuánto tardan el DNS, la conexión, el SSL y el servidor, medido tres veces.
Comprobar certificado SSL
Comprueba el certificado SSL/TLS de un sitio web: si es de confianza, cuándo caduca, quién lo emitió y qué dominios cubre.
Consulta DNS
Consulta los registros DNS de un dominio: A, AAAA, CNAME, MX, NS y TXT. Útil para diagnosticar problemas del sitio web y del correo.