Inicio›Herramientas de color› Conversor de colorNavegador
Convertir un color entre HEX, RGB y HSL
Muestra un color en todas las notaciones habituales al mismo tiempo. No hay que elegir dirección — escoge o pega un color y lee el formato que necesites.
- HEX
- #2F6FEB
- RGB
- rgb(47, 111, 235)
- HSL
- hsl(220, 82%, 55%)
- Variable CSS
- --brand: #2f6feb;
Ajustes habituales
Cada uno tiene su propia página, que explica de dónde sale ese requisito y qué puedes esperar.
Cómo se usa
- 1Elige un color con la muestra, o pega un valor como #3b82f6.
- 2Lee la notación que necesites — se muestran todas a la vez.
- 3Copia la línea de variable CSS si vas a meter el color en una hoja de estilos.
Preguntas frecuentes
- ¿Por qué no hay que elegir una dirección?
- Porque HEX, RGB y HSL son tres maneras de escribir el mismo color, no tres formatos entre los que se convierte. Mostrarlos todos a la vez ahorra un clic y la duda de en qué sentido ibas.
- ¿Cuándo conviene usar HSL en vez de HEX?
- Cuando estás construyendo variaciones. HSL separa tono, saturación y luminosidad, así que un estado hover es el mismo color con diez puntos menos de luminosidad — un cambio sobre el que puedes razonar. En HEX ese mismo cambio son tres números sin relación aparente.
- ¿HEX y RGB son exactamente equivalentes?
- Sí, para los valores de ocho bits que usan ambas notaciones: #3b82f6 y rgb(59, 130, 246) son los mismos 24 bits escritos de otra forma. HSL es un sistema de coordenadas distinto sobre el mismo espacio, así que un valor convertido puede quedar a una fracción al redondear de vuelta.
- ¿Qué es un código hexadecimal de tres dígitos?
- Una abreviatura: #f00 se expande a #ff0000 duplicando cada dígito. Solo puede expresar colores cuyos pares de canal se repiten, así que cubre 4.096 de los 16,7 millones — vale para un rojo rápido, no para un color de marca.