HEX para HSL: #721378
Também conhecida como: Tailwind fuchsia-900
Resultado
#721378 → hsl(296 73% 27%)
Os valores aparecem com precisão total, então converter de volta dá exatamente #721378. A forma arredondada é a que normalmente se cola no CSS.
Cálculo passo a passo
Cada número é calculado a partir da entrada; nada é consultado em tabelas.
1. RGB ÷ 255
R = 0.4471 G = 0.0745 B = 0.4706
2. max, min, Δ
max = 0.4706 min = 0.0745 Δ = max − min = 0.3961
3. L
L = (max + min) / 2 = 0.2725 = 27.25%
4. S
S = Δ / (1 − |2L − 1|) = 0.7266 = 72.66%
5. H
max is B → H = 60° × ((R − G) / Δ + 4) = 60° × ((0.4471 − 0.0745) / 0.3961 + 4) = 296.44°
6. HSL
hsl(296.44 72.66% 27.25%)
Todos os formatos
- HEX
- #721378
- RGB
- rgb(114 19 120)
- RGB (legacy)
- rgb(114, 19, 120)
- HSL
- hsl(296.44 72.66% 27.25%) → hsl(296 73% 27%)
- HWB
- hwb(296 7% 53%)
- OKLCH
- oklch(0.401 0.170 325.4) · oklch(40.1% 0.170 325.4)
- OKLab
- oklab(0.401 0.140 -0.097)
- Lab (D50)
- lab(27.71 48.65 -34.59)
- LCH (D50)
- lch(27.71 59.70 324.59)
- Display P3
- color(display-p3 0.4094 0.1114 0.4546)
- Linear sRGB
- color(srgb-linear 0.1683 0.0065 0.1878)
Gamut: sRGB e Display P3
#721378 é uma cor hexadecimal, portanto está dentro do sRGB e, por isso, do Display P3. Com esta luminosidade e matiz, o sRGB chega a um croma de 0.187 e o Display P3 a 0.203; esta cor usa 91% do croma sRGB disponível.
Trechos de CSS
.element {
color: #721378;
color: rgb(114 19 120);
color: hsl(296 73% 27%);
color: oklch(0.401 0.170 325.4);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.401 0.170 325.4);
}
/* arbitrary values */
class="text-[#721378] bg-[oklch(0.401_0.170_325.4)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.4094 0.1114 0.4546); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #721378 calc(l - 0.1) c h); }Cores próximas
Cores mais próximas nas paletas do Tailwind e do CSS (distância OKLab).
- v3 fuchsia-900#701A75
- purple#800080
- v3 fuchsia-800#86198F
- darkmagenta#8B008B
- v3 purple-900#581C87
- fuchsia-800#8A0194
- purple-900#59168B
- rebeccapurple#663399
Mais claro e mais escuro, mesmo matiz e croma
- #852A8A · oklch(0.461 0.170 325.4) · ΔL +0.06
- #600066 · oklch(0.341 0.170 325.4) · ΔL −0.06