Conversor de Código de Color
Convierte entre RGB, HEX, HSL, HSV y CMYK con selector de color y verificador de contraste
Selector de Color
Vista Previa
Formatos de Color
Paleta de Colores
Verificador de Contraste
Texto de Ejemplo
Este es un texto de ejemplo más pequeño para pruebas de legibilidad.
Acerca de esta herramienta
El conversor de códigos de color es una herramienta gratuita para diseñadores y desarrolladores que convierte entre RGB, HEX, HSL, HSV y CMYK. Puedes elegir un color de forma intuitiva, generar automáticamente paletas de colores complementarios y análogos y comprobar la relación de contraste WCAG entre el texto y el fondo. Es útil para diseñar webs y aplicaciones, gestionar colores de marca y verificar la accesibilidad.
Cómo se usa
- 1 Elige un color con el selector o escribe un valor HEX directamente.
- 2 Los valores de RGB, HSL, HSV y CMYK aparecen a la vez.
- 3 Revisa la paleta generada de colores complementarios y análogos.
- 4 Usa el verificador de contraste para confirmar que el texto se lee bien sobre el fondo.
Cómo funciona
El RGB mezcla luz roja, verde y azul, cada una de 0 a 255, y es la base del color en pantalla. El HEX es ese mismo RGB escrito como dos dígitos hexadecimales por canal, de modo que #FF8800 es rojo 255, verde 136 y azul 0. El HSL describe el color por tono (Hue, 0-360 grados), saturación y luminosidad, más cercano a la percepción humana y fácil de ajustar. El HSV sustituye la luminosidad por el valor (brillo). El CMYK usa cantidades de tinta cian, magenta, amarillo y negro y está pensado para impresión. La relación de contraste es el cociente de la luminancia relativa de dos colores; WCAG recomienda al menos 4,5:1 para texto normal en nivel AA y 7:1 en AAA.
Preguntas frecuentes
¿En qué se diferencian HEX y RGB?
Llevan la misma información de color. El RGB lista rojo, verde y azul como decimales de 0 a 255, mientras que el HEX los empaqueta en dos dígitos hexadecimales cada uno. #FF0000 y rgb(255,0,0) son el mismo rojo.
¿Qué significa el nivel de contraste AA de WCAG?
Es un estándar de legibilidad: el texto de tamaño normal necesita una relación de contraste de al menos 4,5:1 con el fondo, y el texto grande se admite con 3:1.
¿Para qué sirve el HSL?
Permite cambiar la saturación o la luminosidad manteniendo el tono, por lo que resulta intuitivo crear variaciones del mismo color y tonos para el estado hover.
¿Por qué cambian los colores entre CMYK y RGB?
El RGB es mezcla aditiva de luz y el CMYK mezcla sustractiva de tinta, con gamas distintas. Los colores vivos en pantalla pueden verse más apagados al imprimirse.
¿Qué son los colores complementarios y análogos?
Los complementarios están en el lado opuesto del círculo cromático y dan fuerte contraste; los análogos son vecinos y aportan armonía. La herramienta calcula ambos automáticamente.
Herramientas y usos relacionados
Para entender cómo funciona el HEX ayuda el conversor de bases numéricas. Para dimensiones de diseño consulta el conversor de longitudes y, para maquetación web, las conversiones de px, rem y em.