HEX in OKLCH: #34D399
Noto anche come: Tailwind v3 emerald-400
Risultato
#34D399 → oklch(0.773 0.153 163.2)
I valori sono mostrati a piena precisione, quindi riconvertendo si ottiene esattamente #34d399. La forma arrotondata è quella che di solito incolli nel CSS.
Calcolo passo passo
Ogni numero è calcolato dall’input, nulla viene cercato in tabelle.
1. sRGB → linear
R: 52/255 = 0.20392 → 0.034340 (((x + 0.055) / 1.055)^2.4) G: 211/255 = 0.82745 → 0.651406 (((x + 0.055) / 1.055)^2.4) B: 153/255 = 0.60000 → 0.318547 (((x + 0.055) / 1.055)^2.4)
2. linear sRGB → LMS
l = 0.4122·R + 0.5363·G + 0.0514·B = 0.379914 m = 0.2119·R + 0.6807·G + 0.1074·B = 0.484899 s = 0.0883·R + 0.2817·G + 0.6300·B = 0.387223
3. cube root
l′ = ∛0.379914 = 0.724261 m′ = ∛0.484899 = 0.785628 s′ = ∛0.387223 = 0.728876
4. LMS′ → Oklab
L = 0.2105·l′ + 0.7936·m′ − 0.0041·s′ = 0.77294 a = 1.9780·l′ − 2.4286·m′ + 0.4506·s′ = -0.14696 b = 0.0259·l′ + 0.7828·m′ − 0.8087·s′ = 0.04430
5. Oklab → OKLCH
C = √(a² + b²) = 0.15349 H = atan2(b, a) = 163.223° L = 0.77294
6. OKLCH
oklch(0.77294 0.15349 163.223) rounded: oklch(0.773 0.153 163.2)
Tutti i formati
- HEX
- #34d399
- RGB
- rgb(52 211 153)
- RGB (legacy)
- rgb(52, 211, 153)
- HSL
- hsl(158.11 64.37% 51.57%) → hsl(158 64% 52%)
- HWB
- hwb(158 20% 17%)
- OKLCH
- oklch(0.773 0.153 163.2) · oklch(77.3% 0.153 163.2)
- OKLab
- oklab(0.773 -0.147 0.044)
- Lab (D50)
- lab(75.70 -52.19 16.76)
- LCH (D50)
- lch(75.70 54.81 162.20)
- Display P3
- color(display-p3 0.4154 0.8158 0.6162)
- Linear sRGB
- color(srgb-linear 0.0343 0.6514 0.3185)
Gamut: sRGB e Display P3
#34D399 è 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.167 e Display P3 a 0.229; questo colore usa il 92% della croma sRGB disponibile.
Snippet CSS
.element {
color: #34d399;
color: rgb(52 211 153);
color: hsl(158 64% 52%);
color: oklch(0.773 0.153 163.2);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.773 0.153 163.2);
}
/* arbitrary values */
class="text-[#34d399] bg-[oklch(0.773_0.153_163.2)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.4154 0.8158 0.6162); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #34d399 calc(l - 0.1) c h); }Colori vicini
I colori più vicini nelle palette Tailwind e CSS (distanza OKLab).
- emerald-400#00D492
- mediumaquamarine#66CDAA
- teal-400#00D5BE
- v3 green-400#4ADE80
- v3 teal-400#2DD4BF
- green-400#05DF72
- emerald-500#00BC7D
- emerald-300#5EE9B5
Più chiaro e più scuro, stessa tonalità e croma
- #50E7AC · oklch(0.833 0.153 163.2) · ΔL +0.06
- #01BF87 · oklch(0.713 0.153 163.2) · ΔL −0.06