HEX a HSL: #BA55D3
También conocido como: CSS mediumorchid
Resultado
#BA55D3 → hsl(288 59% 58%)
Los valores se muestran con precisión completa, así que al convertir de vuelta obtienes exactamente #ba55d3. La forma redondeada es la que normalmente pegas en CSS.
Cálculo paso a paso
Cada número se calcula a partir de la entrada; no se consulta ninguna tabla.
1. RGB ÷ 255
R = 0.7294 G = 0.3333 B = 0.8275
2. max, min, Δ
max = 0.8275 min = 0.3333 Δ = max − min = 0.4941
3. L
L = (max + min) / 2 = 0.5804 = 58.04%
4. S
S = Δ / (1 − |2L − 1|) = 0.5888 = 58.88%
5. H
max is B → H = 60° × ((R − G) / Δ + 4) = 60° × ((0.7294 − 0.3333) / 0.4941 + 4) = 288.10°
6. HSL
hsl(288.10 58.88% 58.04%)
Todos los formatos
- HEX
- #ba55d3
- RGB
- rgb(186 85 211)
- RGB (legacy)
- rgb(186, 85, 211)
- HSL
- hsl(288.10 58.88% 58.04%) → hsl(288 59% 58%)
- HWB
- hwb(288 33% 17%)
- OKLCH
- oklch(0.626 0.202 319.2) · oklch(62.6% 0.202 319.2)
- OKLab
- oklab(0.626 0.153 -0.132)
- Lab (D50)
- lab(53.37 55.02 -47.45)
- LCH (D50)
- lch(53.37 72.66 319.23)
- Display P3
- color(display-p3 0.6800 0.3561 0.8025)
- Linear sRGB
- color(srgb-linear 0.4910 0.0908 0.6514)
Gamut: sRGB y Display P3
#BA55D3 es un color hexadecimal, así que está dentro de sRGB y, por tanto, de Display P3. Con esta luminosidad y este tono, sRGB llega a un croma de 0.301 y Display P3 a 0.324; este color usa el 67 % del croma sRGB disponible.
Fragmentos CSS
.element {
color: #ba55d3;
color: rgb(186 85 211);
color: hsl(288 59% 58%);
color: oklch(0.626 0.202 319.2);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.626 0.202 319.2);
}
/* arbitrary values */
class="text-[#ba55d3] bg-[oklch(0.626_0.202_319.2)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.6800 0.3561 0.8025); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #ba55d3 calc(l - 0.1) c h); }Colores cercanos
Colores más próximos en las paletas de Tailwind y CSS (distancia OKLab).
- v3 purple-500#A855F7
- v3 fuchsia-600#C026D3
- v3 fuchsia-500#D946EF
- purple-500#AD46FF
- mediumpurple#9370DB
- orchid#DA70D6
- fuchsia-600#C800DE
- darkorchid#9932CC
Más claro y más oscuro, mismo tono y croma
- #CE68E7 · oklch(0.686 0.202 319.2) · ΔL +0.06
- #A741BF · oklch(0.566 0.202 319.2) · ΔL −0.06