Resultado
Esta página no tiene parte de servidor en absoluto. La tabla que pegas la procesa JavaScript dentro de tu propio navegador, el gráfico se dibuja en un elemento canvas de tu máquina y el archivo de exportación se arma localmente. Nada se sube, se almacena ni se escribe en ningún registro. Puedes desconectar la red después de cargar la página y todo seguirá funcionando: es la forma más sencilla de comprobarlo tú mismo.
Datos y límites del método
| Rango del tono | De 0° a 360° |
|---|---|
| Rango de saturación y valor | De 0% a 100% |
| Fórmula del valor | V = máx(R, G, B) / 255 |
| Fórmula de la saturación | S = (máx − mín) / máx, con máx = 0 → S = 0 |
Cuándo induce a error
- HSV no es el único modelo cilíndrico — no lo confundas con el modelo similar pero distinto HSL (el tono se define igual en ambos, pero la saturación y la luminosidad/valor se calculan de forma diferente).
- En colores muy oscuros (valor cercano a 0%) el tono y la saturación pierden relevancia — tonos visualmente distintos pueden verse como el mismo color casi negro.
- Con saturación cero (tonos de gris, incluidos negro y blanco) el tono no está matemáticamente definido — el conversor muestra 0° en ese caso.
- El resultado es solo otro sistema de coordenadas para el mismo color, no un espacio de color distinto — no lleva información de perfil de color de pantalla.
Cómo se calcula
Los valores R, G y B se normalizan dividiéndolos entre 255, dando números de 0 a 1.
El valor (V) es el máximo de los valores normalizados R, G, B.
La saturación (S) se calcula como la razón entre la diferencia del canal máximo y mínimo y el máximo (con máximo igual a cero, la saturación se toma como cero).
El tono (H) se calcula según cuál de R, G o B sea el máximo, usando una fórmula por tramos que da un valor de 0° a 360°.
Preguntas y respuestas
¿En qué se diferencia HSV de HSL?
El tono se define igual en ambos modelos, pero la saturación y la luminosidad/valor usan fórmulas distintas, así que porcentajes idénticos de S y L (o V) en HSL y HSV producen colores diferentes.
¿Por qué muestra un tono de 0° cuando S=0% y el color es gris?
El tono no está matemáticamente definido para tonos de gris, así que por convención se usa 0° — no afecta cómo se percibe el color gris.
¿Puedo usar HSV directamente en CSS?
El CSS moderno no admite una función hsv() directamente — para usarlo en estilos es más práctico convertir el resultado a HSL o HEX/RGB con otro conversor.
¿Se envían mis datos a algún sitio?
No, todo el cálculo se ejecuta en tu navegador.