Haz clic o arrastra sobre cualquier parte de la imagen para tomar un color
Los colores que tomes de la imagen se registrarán aquí para que puedas verlos y compararlos después
Sube una imagen, mueve el mouse o el dedo sobre ella; la lupa mostrará en tiempo real los píxeles ampliados alrededor del cursor para ayudarte a posicionarte con precisión, y al hacer clic se toma el color de esa posición, mostrando al instante los formatos HEX, RGB y HSL con copia de un clic, además de guardar un historial de colores para comparar. Todo esto ocurre en tu navegador, sin subir archivos a ningún servidor.
Tomar y leer colores ocurre completamente en tu navegador; la imagen nunca pasa por ningún servidor
Al pasar el cursor se amplía en tiempo real la zona alrededor, con un recuadro rojo marcando el píxel exacto a tomar
HEX, RGB y HSL se muestran a la vez; haz clic en copiar y pégalo directo en tu herramienta de diseño o código
Sin registro, sin pago, y sin límites ocultos de uso
Casos típicos
Ya sea extraer un color de marca, tomar referencia de una foto o verificar una implementación, con un clic en la imagen obtienes el valor exacto.
Cuando ves una combinación de colores o una identidad visual que te gusta, sube la captura y haz clic directamente sobre el color clave para obtener su valor HEX exacto y usarlo en tu propio diseño o código.
Extrae de una foto de paisaje o retrato el tono del cielo, la piel o las plantas, como referencia base para la paleta de colores de un diseño o ilustración.
Al replicar un diseño en desarrollo, toma el color en la captura del diseño original y en la captura de la página real para comparar sus valores HEX, y confirma rápido si el color se implementó correctamente sin depender solo de la vista.
Formatos de color
Tres formas distintas de describir el mismo color; elige el formato según dónde lo vayas a usar.
| Formato | Ejemplo de escritura | Caso de uso común |
|---|---|---|
| HEX | #FF3B30 | CSS de páginas web y el campo de color de la mayoría de herramientas de diseño (como Figma, Photoshop) |
| RGB | rgb(255, 59, 48) | Cuando necesitas ver o ajustar por separado los valores de rojo, verde y azul |
| HSL | hsl(4, 100%, 59%) | Descripción por tono, saturación y luminosidad, útil para ajustar intensidad o claridad dentro del mismo tono |
Los tres formatos describen exactamente el mismo color, solo cambia la forma de representar el valor; cada formato en la página se puede copiar con un clic y pegar directamente en tu herramienta de diseño o editor de código.
Cómo usar
No necesitas instalar ningún software; todo dentro de la página web, con la lupa ayudándote a posicionarte con precisión.
Haz clic para elegir o arrastra la imagen directamente a la página; admite JPG, PNG, WebP y GIF, hasta 20MB, una imagen a la vez.
Mueve el cursor sobre la imagen; la lupa muestra en tiempo real los píxeles ampliados alrededor, con un recuadro rojo marcando la posición exacta que se va a tomar.
Haz clic en la posición deseada o suelta el dedo para tomar el color; al instante se muestran los valores HEX, RGB y HSL.
Haz clic en el botón de copiar junto al formato que necesites, para copiar el valor al portapapeles y usarlo donde quieras.
Cómo funciona
La imagen se decodifica primero en el navegador y se dibuja en un lienzo con exactamente la misma resolución que el original; lo que ves en la página es solo esa vista reducida. Al hacer clic para tomar el color, la posición mostrada se convierte a la coordenada real del lienzo para leer el color, así que sin importar cuán pequeña se muestre la imagen en pantalla, la precisión siempre corresponde a la resolución original, sin distorsión por el escalado visual.
La función del selector de color es “leer el valor de color de un píxel al hacer clic”, una herramienta puramente interactiva de consulta que no genera ningún archivo de imagen para descargar, por lo que no existe la semántica de “procesar varias imágenes de forma independiente para obtener varios resultados” propia de un lote. Si necesitas tomar colores de varias imágenes, simplemente súbelas una por una; cada vez que cambies de imagen se borrará el historial de colores actual.
Preguntas frecuentes
El selector de color es una función interactiva de solo lectura de píxeles; no genera ningún archivo exportable, por lo que no existe el concepto de “lote”: sin importar el tamaño de la imagen que subas, siempre haces clic en una posición específica para leer su color, así que esta herramienta solo admite una imagen a la vez, sin modo por lotes.
Ocurre completamente en el navegador de tu propio dispositivo, usando las capacidades nativas de lectura de píxeles de Canvas para leer directamente el valor del color en esa posición desde los datos de la imagen, sin subir nunca el original a ningún servidor.
La lupa muestra una vista ampliada de una pequeña zona alrededor de donde está el cursor, mientras que el color que realmente se toma es el del píxel exacto marcado por el recuadro rojo; si la imagen tiene degradados o ruido, los píxeles vecinos pueden tener diferencias sutiles de color. Mientras tomes el color guiándote por el píxel marcado con el recuadro rojo, el valor será exactamente el correspondiente, sin desviaciones.
El historial solo se guarda en la memoria del navegador durante la sesión actual, para que puedas comparar varios colores tomados en la misma sesión; al recargar o cerrar la página, el historial se borra, sin guardarse ni subirse de forma permanente. Si necesitas conservar un valor de color a largo plazo, cópialo y pégalo en tus propias notas o herramienta de diseño.
HEX (como #FF3B30) es el formato más usado en desarrollo web y en la mayoría de herramientas de diseño; es compacto y fácil de pegar. RGB (como rgb(255, 59, 48)) es más intuitivo cuando necesitas ajustar por separado los canales rojo, verde y azul. HSL (como hsl(4, 100%, 59%)) describe el color por tono, saturación y luminosidad, útil para ajustar la intensidad o claridad dentro del mismo tono. Los tres formatos describen exactamente el mismo color; elige el que corresponda a la herramienta o código donde lo vas a pegar.
Sí. El selector lee los datos de píxeles reales tras decodificar la imagen, sin importar el tamaño en que se muestre en pantalla; aunque la imagen se vea reducida en la página, la lectura siempre se hace con precisión sobre la resolución real de la imagen, sin desviarse por el escalado en pantalla.
Sin registro, sin esperas: cópialo con un clic y úsalo de inmediato.