Convertidor de RGB a HSV

Cómo funciona

Escriba un color por línea; no tiene que elegir la dirección, porque la herramienta reconoce la notación. rgb(154, 52, 18), la secuencia simple "154 52 18" y un código HEX como #9A3412 se leen como RGB y se convierten a HSV: este rojo ladrillo queda en hsv(15, 88%, 60%), es decir, tono de 15 grados, saturación del 88 % y valor del 60 %. En sentido contrario, hsv(145, 70%, 55%) da rgb(42, 140, 83) y el verde #2A8C53. El selector de color de Photoshop muestra los mismos números con el nombre HSB, así que hsb(15, 88, 60) y "H15 S88 B60" también se aceptan. Un punto a vigilar: tres números sin prefijo ni símbolo siempre se leen como RGB. Si escribe "24 88 60", obtiene un verde oscuro en RGB; si se refiere a HSV, escriba hsv(24, 88%, 60%) o 24° 88% 60%. Si trabaja con OpenCV en Python, elija la escala de OpenCV como salida y los valores aparecerán en los rangos 0-179 y 0-255 que espera esa biblioteca. Las líneas que no se pueden leer se marcan y el resto se convierte igualmente.

Esta herramienta también se busca como rgb a hsv, convertir rgb a hsv, hsv a rgb, convertidor rgb a hsv, hex a hsv, convertir hsv a rgb.

¿Qué es HSV (HSB)?

El HSV describe un color con tres respuestas: el tono (hue) indica su lugar en el círculo cromático en grados, la saturación qué tan vivo o agrisado es y el valor qué tan claro es. El tono 0 es rojo, 120 verde y 240 azul; con saturación cero el color se vuelve gris y con valor cero, negro. Photoshop presenta el mismo modelo como HSB. Se calcula a partir del RGB: no es un nuevo espacio de color, sino una forma de escribir el RGB que se parece a cómo las personas describimos los colores.

¿Qué es Ángulo de tono?

El tono es la posición del color en el círculo cromático y se escribe en grados: 0 rojo, 60 amarillo, 120 verde, 180 cian, 240 azul y 300 magenta; 360 grados vuelve al rojo, por eso la herramienta devuelve 0 para 360. Los grises, el blanco y el negro no tienen tono; la fórmula les asigna 0. Para saber si dos colores pertenecen a la misma familia basta con comparar su ángulo de tono, aunque sus números RGB parezcan no tener relación.

¿Qué es RGB?

El RGB escribe la luz roja, verde y azul de cada píxel con tres números de 0 a 255 y es el único idioma que navegadores, celulares y monitores entienden directamente. Como esos números siguen al hardware, aclarar u opacar un poco un color en RGB obliga a cambiar los tres a la vez. Pasar a HSV reduce ese ajuste a un solo número; después, el valor ajustado se vuelve a convertir a RGB o HEX para la pantalla.

¿Cuál es la diferencia entre HSV y HSL?

Ambos modelos escriben el tono en la misma escala de grados; se diferencian en el tercer valor. En HSV, la forma más pura de un color está en valor 100 % y saturación 100 %, y el blanco se obtiene con saturación 0 y valor 100. En HSL, el color puro está en luminosidad (L) del 50 %, y una luminosidad de 100 da blanco sea cual sea el tono. Por eso el mismo color tiene un porcentaje de saturación distinto en cada modelo. CSS entiende hsl() pero no hsv(), mientras que los selectores de color de los programas de diseño usan sobre todo HSV/HSB. Si necesita HSL, el convertidor de códigos de color del sitio pasa HEX a HSL.

¿Por qué el mismo color tiene valores HSV distintos en cada programa?

El HSV tiene una sola fórmula, pero no una sola manera de escribir el resultado; cada programa lo reparte en su propia escala. Photoshop y GIMP muestran el tono en grados de 0 a 360 y la saturación y el valor en porcentaje de 0 a 100: es la escala de esta herramienta. El módulo colorsys de Python devuelve los tres valores entre 0 y 1. OpenCV divide el tono entre dos para imágenes de 8 bits (0 a 179) y estira la saturación y el valor a 0-255. El modo HSV de Pillow mantiene los tres canales en 0-255.

Por eso, antes de pegar un valor HSV sacado de un ejemplo de código o de un tutorial, compruebe en qué escala está escrito. El amarillo anotado como (30, 255, 255) en OpenCV equivale a hsv(60, 100%, 100%) en grados y porcentajes; si escribe directamente los números de OpenCV en este cuadro, obtendrá un color equivocado. La escala de OpenCV se ofrece solo como salida y puede diferir en una unidad del cálculo entero de OpenCV.

Para qué sirve el HSV y para qué no

El HSV separa un color como lo describimos las personas: qué color (tono), qué tan vivo (saturación), qué tan claro (valor). Para crear tonos más claros u oscuros de un color de marca, se mantiene el tono y solo se cambia el valor; la familia de color no se altera. En procesamiento de imágenes, para aislar un color —un fondo verde, una señal roja— se usa un rango HSV en lugar de RGB, porque el tono apenas cambia con la luz y la sombra.

Sin embargo, CSS no tiene una función hsv(); en una página web los colores se escriben en HEX, rgb() o hsl(). Por eso la herramienta muestra HEX y RGB junto a cada valor HSV: encuentra el color en un selector y copia su código HEX en su hoja de estilos.

• Selector de Photoshop/GIMP, archivos de diseño → HSV/HSB (grados y porcentajes)
• Sitio web, CSS, presentaciones → HEX o rgb()
• Máscaras de color con Python + OpenCV → escala de OpenCV (0-179, 0-255)

Preguntas frecuentes

¿Cómo convierto un color RGB a HSV?

Escriba el color en una línea como rgb(154, 52, 18) o simplemente "154 52 18"; el resultado aparece como hsv(15, 88%, 60%) con una muestra del color. Si tiene un código HEX (#9A3412), péguelo directamente.

¿HSV y HSB son lo mismo?

Sí. El valor (V) y el brillo (B) describen el mismo número; Photoshop llama al modelo HSB y muchos otros programas lo llaman HSV. La herramienta también lee hsb(…) y "H15 S88 B60" como HSV.

¿Por qué en OpenCV el tono no pasa de 180?

OpenCV guarda cada canal de una imagen de 8 bits entre 0 y 255. Un tono de 360 grados no cabe, así que se divide entre dos (0-179), mientras que la saturación y el valor se escalan a 0-255. Elija la escala de OpenCV como formato de salida y los valores aparecerán en esos rangos.

Escribí tres números y salió un color equivocado, ¿por qué?

Tres números sin prefijo ni símbolo se leen como RGB. Para introducir HSV, escriba hsv(24, 88%, 60%) o agregue los signos de grado y porcentaje; entonces la herramienta trata la línea como HSV.