Mapa de Color HSV
Elige colores en un mapa HSV interactivo y conviértelos al instante a valores HEX, RGB, HSL y HSV.
Mapa de color
Color seleccionado
Color seleccionado
#3C89D6
HEX
#3C89D6
RGB
rgb(60, 137, 214)
HSL
hsl(210, 65%, 54%)
HSV
hsv(210, 72%, 84%)
Saturación
72%
Valor
84%
Elige colores con control visual
Usa el mapa HSV cuando necesites ajustar un color de forma visual y copiar valores exactos para código o diseño. Sirve para estados de UI, gráficos, paletas, temas y pruebas de marca.
Por qué usar este mapa de color HSV
Selección visual
Haz clic o arrastra en el mapa para ajustar saturación y valor con respuesta visual directa.
Varios formatos
Copia valores HEX, RGB, HSL y HSV desde el mismo color seleccionado.
Pega HEX para revisar
Introduce un color HEX de 6 dígitos y mueve el selector a la posición HSV equivalente.
Control rápido del tono
Mueve el control de tono para cambiar toda la familia de color manteniendo el mapa claro.
Cómo funciona este Mapa de Color HSV
El mapa de color HSV te permite elegir un color cambiando tono, saturación y valor. El tono controla la familia de color base, la saturación controla la intensidad y el valor define qué tan claro u oscuro se ve. El mapa cuadrado combina saturación de izquierda a derecha y valor de abajo hacia arriba, por lo que puedes hacer clic o arrastrar para elegir un matiz exacto. El control de tono actualiza todo el mapa al instante. Cada selección se convierte a HEX, RGB, HSL y HSV, listos para copiar en CSS, sistemas de diseño, maquetas, gráficos o trabajo de marca. También puedes pegar un color HEX de 6 dígitos para colocar el selector en su posición HSV equivalente. Todas las conversiones ocurren en el navegador.
Cómo usar este Mapa de Color HSV
Elige el tono
Mueve el control de tono para seleccionar la familia de color.
Elige el matiz
Haz clic o arrastra en el mapa para ajustar saturación y valor.
Copia códigos
Usa el valor HEX, RGB, HSL o HSV generado en tu proyecto.
Ejemplo de Uso
Selección de un color azul de acento para interfaz:
Preguntas Frecuentes
¿Qué es el color HSV?
¿En qué se diferencia HSV de HSL?
¿Puedo usar HSV en CSS?
¿Qué hace la saturación?
¿Qué hace el valor en HSV?
¿Puedo pegar un color HEX?
¿Sirve para sistemas de diseño?
¿La herramienta guarda colores?
Herramientas relacionadas
RGB to Pantone
Convierte rgb to pantone al instante. Herramienta gratuita y segura en línea.
Generador de Color Aleatorio
Genera random color de forma instantánea. Herramienta gratuita y fácil de usar.
Generador de Degradados
Crea degradados CSS personalizados con vista previa en vivo. Gratis en línea.
Selector de Color de Imagen
Selecciona colores de cualquier imagen. Obtén valores HEX, RGB y HSL.
Verificador de Contraste de Color
Verifica el contraste de color para cumplir con las pautas de accesibilidad WCAG.
Convertidor de Pantone a HEX
Convierte pantone to hex al instante. Herramienta gratuita y segura en línea.
El Mapa de Color HSV es mantenido por CodeItBro. Nuestro objetivo es ofrecer las mejores herramientas gratuitas para desarrolladores en la web. Si tienes comentarios o sugerencias, visita nuestra página de contacto.
Destacado En
