Por qué conviene tomar una muestra en lugar de adivinar
La iluminación, los colores cercanos y los ajustes de la pantalla cambian nuestra percepción de un tono. Dos azules parecidos pueden contener valores RGB distintos, y el mismo valor puede verse diferente en dos pantallas. Leer el píxel elimina la estimación dentro del archivo; al trasladar el resultado a otros dispositivos o a impresión, la gestión del color sigue siendo importante.
Cómo describen un color HEX, RGB y HSL
HEX y RGB pueden expresar los mismos canales rojo, verde y azul con notaciones distintas: #2563eb corresponde a rgb(37, 99, 235). HSL representa ese color mediante matiz, saturación y luminosidad. Los valores HSL convertidos suelen redondearse, por lo que una conversión de regreso puede variar en algún canal. Usa el formato que requiera tu herramienta de diseño o tu código.
No necesitas abrir un editor de imágenes completo
Antes de que existieran las herramientas que funcionan en el navegador, obtener un código de color de una imagen significaba abrirla en un editor de imágenes completo, usar una herramienta de cuentagotas escondida en alguna barra de herramientas, y leer el valor en un cuadro de diálogo de selector de color, suponiendo que tuvieras ese tipo de software instalado. Funciona, pero son muchos pasos para algo que debería tomar cinco segundos, y simplemente no es una opción si estás en un teléfono o en una computadora sin programas de diseño.
Selecciona un píxel y consulta su valor
Abre la imagen en un selector que funcione en el navegador y marca el punto que quieres examinar. La herramienta lee el píxel decodificado y muestra sus representaciones HEX, RGB y HSL. Si el procesamiento es local, la imagen puede permanecer en tu dispositivo.
Qué hacer con el código una vez que lo tienes
Copia el valor en CSS, en una herramienta de diseño o en una paleta de trabajo. Si se trata de una marca establecida, compáralo con su guía oficial cuando exista: una captura o un logotipo comprimido puede no conservar el valor original. En impresión también influyen los perfiles de color, las tintas, el papel y la conversión de RGB a CMYK.
Situaciones comunes en las que lo necesitarás
- Un cliente te envía un logotipo antiguo y necesitas extraer su azul de marca exacto para usarlo en un diseño nuevo, sin ninguna guía de estilo como referencia.
- Detectas un color de fondo en un sitio web o en una captura de pantalla que quieres reutilizar en tu propio proyecto.
- Estás recreando una paleta de colores a partir de una foto (un producto, una obra de arte, una habitación que estás decorando) y quieres que sea precisa en lugar de aproximada.
- Estás depurando un problema de CSS y necesitas confirmar si dos elementos que se ven del mismo color realmente comparten el mismo valor exacto.
La muestra proporciona un valor reproducible. Si la fuente contiene suavizado de bordes, textura, sombras o degradados, examina varios píxeles cercanos antes de decidir cuál representa el color que necesitas.
La compresión, los bordes y los perfiles afectan la muestra
La compresión JPEG puede alterar los píxeles, sobre todo cerca de bordes definidos y degradados. El suavizado también puede mezclar un color sólido con el fondo. Toma la muestra en una zona uniforme, lejos de los bordes, y utiliza la fuente menos comprimida disponible. Un perfil de color incrustado también puede cambiar la forma en que distintos programas interpretan y muestran los valores.
Preguntas sobre la extracción de colores
¿Funciona con capturas de pantalla? Sí. Cualquier formato que el navegador pueda mostrar, incluidas capturas PNG, JPG o WebP, funciona de la misma manera.
¿Puedo obtener varios colores de la misma imagen? Sí. Puedes seleccionar tantos píxeles como necesites, uno por uno, sin volver a elegir el archivo.
¿Necesito instalar un programa de diseño? No. Todo el proceso se realiza en el navegador, así que no hay nada que instalar.
Obtén un código de color de cualquier imagen
El selector de color de Orisod funciona íntegramente en tu navegador. Selecciona o arrastra una imagen, haz clic en un píxel y obtén al instante sus valores HEX, RGB y HSL. La imagen permanece en tu dispositivo.
Elegir un color de una imagen →Un píxel seleccionado te ofrece un valor comprobable del archivo de origen. Revisa los píxeles cercanos y el medio de salida antes de adoptarlo como color final de producción.