Selector y Conversor de Color
Elige un color con el selector, arrastra la barra de tono o escribe tu valor HEX/RGB/HSL y obtén al instante su representación en todos los formatos, con preview en vivo.
Selecciona un color
Color seleccionado
#3B82F6rgb(59, 130, 246)hsl(217, 91%, 60%)cmyk(76%, 47%, 0%, 4%)Consultas populares
Cómo usar: Selector color
- 1Elige un color con el selector o escribe su código HEX.
- 2Consulta sus valores HEX, RGB y HSL.
- 3Copia el formato que necesites o su color complementario.
¿Para qué sirve?
- Pasar colores de un diseño a CSS.
- Convertir entre HEX, RGB y HSL.
- Encontrar el complementario de un color de marca.
Formatos de color: HEX, RGB y HSL
Tres formas de lo mismo
HEX (#1d4ed8) es la notación compacta más usada en CSS; RGB expresa la mezcla de rojo, verde y azul de 0 a 255; HSL describe tono (0–360°), saturación y luminosidad, y resulta más intuitivo para ajustar un color.
Por qué usar HSL
Para crear una variante más clara u oscura basta con cambiar la luminosidad sin alterar el tono, algo difícil de hacer con HEX. Es la base de muchos sistemas de diseño.
Transparencia
Con un canal alfa (rgba o HEX de 8 dígitos) el color admite opacidad. Recuerda que el contraste real depende del fondo sobre el que se muestre.
Herramientas relacionadas
Preguntas frecuentes
¿Qué formato debo usar en CSS?+
HEX y RGB son los más usados. HSL es más fácil de leer y ajustar. CMYK es específico de impresión.