HSL in HEX: #7CFC00
Noto anche come: CSS lawngreen
Risultato
hsl(90.48 100.00% 49.41%) → #7CFC00
I valori sono mostrati a piena precisione, quindi riconvertendo si ottiene esattamente #7cfc00. La forma arrotondata è quella che di solito incolli nel CSS.
Calcolo passo passo
Ogni numero è calcolato dall’input, nulla viene cercato in tabelle.
1. input
H = 90.48°, S = 100.00%, L = 49.41%
2. C
C = (1 − |2L − 1|) × S = 0.98820
3. X
X = C × (1 − |(H / 60°) mod 2 − 1|) = 0.48619 (H / 60° = 1.5080, sector 1)
4. m
m = L − C / 2 = 0.00000
5. (R′, G′, B′) + m
(R′, G′, B′) = (0.48619, 0.98820, 0.00000) R = round((0.48619 + 0.00000) × 255) = 124 G = round((0.98820 + 0.00000) × 255) = 252 B = round((0.00000 + 0.00000) × 255) = 0
6. RGB → HEX
#7CFC00
Tutti i formati
- HEX
- #7cfc00
- RGB
- rgb(124 252 0)
- RGB (legacy)
- rgb(124, 252, 0)
- HSL
- hsl(90.48 100.00% 49.41%) → hsl(90 100% 49%)
- HWB
- hwb(90 0% 1%)
- OKLCH
- oklch(0.882 0.263 136.2) · oklch(88.2% 0.263 136.2)
- OKLab
- oklab(0.882 -0.190 0.182)
- Lab (D50)
- lab(89.05 -61.33 83.04)
- LCH (D50)
- lch(89.05 103.23 126.45)
- Display P3
- color(display-p3 0.6169 0.9767 0.3014)
- Linear sRGB
- color(srgb-linear 0.2016 0.9734 0.0000)
Gamut: sRGB e Display P3
#7CFC00 è un colore esadecimale, quindi sta dentro sRGB e di conseguenza dentro Display P3. A questa luminosità e tonalità sRGB arriva a una croma di 0.263 e Display P3 a 0.309; questo colore usa il 100% della croma sRGB disponibile.
Snippet CSS
.element {
color: #7cfc00;
color: rgb(124 252 0);
color: hsl(90 100% 49%);
color: oklch(0.882 0.263 136.2);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.882 0.263 136.2);
}
/* arbitrary values */
class="text-[#7cfc00] bg-[oklch(0.882_0.263_136.2)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.6169 0.9767 0.3014); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #7cfc00 calc(l - 0.1) c h); }Colori vicini
I colori più vicini nelle palette Tailwind e CSS (distanza OKLab).
- chartreuse#7FFF00
- lime#00FF00
- greenyellow#ADFF2F
- lime-400#9AE600
- springgreen#00FF7F
- v3 lime-400#A3E635
- lime-300#BBF451
- v3 lime-300#BEF264
Più chiaro e più scuro, stessa tonalità e croma
- #90FF38 · oklch(0.942 0.263 136.2) · ΔL +0.06
- #67E700 · oklch(0.822 0.263 136.2) · ΔL −0.06