HEX, RGB y HSL
- HEX: 16 números en #RRGGBB formato. #FF0000 es rojo, #000000 es negro #FFFFFF es blanco. Los códigos con los mismos dígitos pares pueden abreviarse (#FFF).
- RGB: rojo, verde, canales azules 0–255. RGB(255, 0, 0) es rojo. Un valor final de "alfa" (0–1) añade transparencia: rgba(0, 0, 0, 0,5) es negro translúcido.
- HSL: tono (0–360°), saturación y brillo (%). HSL(0, 100%, 50%) es rojo. Para encontrar el tono claro u oscuro de un color, solo necesitas cambiar el brillo.
De HEX a RGB
Cada pieza de dos dígitos se convierte de la base 16 a la 10. #3B5998: 3B = 3×16+11 = 59, 59 = 5×16+9 = 89, 98 = 9×16+8 = 152 → rgb(59, 89, 152).
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Rojo | #FF0000 | 255, 0, 0 | 0, 100%, 50% |
| Verde | #00FF00 | 0, 255, 0 | 120, 100%, 50% |
| Azul | #0000FF | 0, 0, 255 | 240, 100%, 50% |
Deja suficiente contraste entre el texto y el suelo (al menos 4,5:1 para texto normal en WCAG).
Preguntas frecuentes
¿Se puede escribir el código HEX en mayúsculas o minúsculas?
Sí, #ff0000 y #FF0000 dan el mismo color.
¿Puedo usar el valor CMYK en la web?
CMYK es para impresión; la pantalla utiliza HEX, RGB o HSL.
¿Cómo añado transparencia a un color?
Convierte HEX a RGB y escribe una transparencia entre 0 y 1 en el valor final en formato rgba().