OKLCH para HEX: #0F766E
Também conhecida como: Tailwind v3 teal-700
Resultado
oklch(0.51094 0.08606 186.391) → #0F766E
Os valores aparecem com precisão total, então converter de volta dá exatamente #0f766e. 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. input
oklch(0.51094 0.08606 186.391)
2. OKLCH → Oklab
a = C·cos H = -0.08553 b = C·sin H = -0.00958
3. Oklab → LMS′
l′ = L + 0.3963·a + 0.2158·b = 0.474976 m′ = L − 0.1056·a − 0.0639·b = 0.520580 s′ = L − 0.0895·a − 1.2915·b = 0.530965
4. cube
l = 0.474976³ = 0.107156 m = 0.520580³ = 0.141079 s = 0.530965³ = 0.149692
5. LMS → linear sRGB
R = 4.0767·l − 3.3077·m + 0.2310·s = 0.004771 G = −1.2684·l + 2.6098·m − 0.3413·s = 0.181169 B = −0.0042·l − 0.7034·m + 1.7076·s = 0.155929
6. linear → sRGB, × 255
R = 0.05877 × 255 = 14.99 → 15 G = 0.46275 × 255 = 118.00 → 118 B = 0.43138 × 255 = 110.00 → 110
7. RGB → HEX
#0F766E
Todos os formatos
- HEX
- #0f766e
- RGB
- rgb(15 118 110)
- RGB (legacy)
- rgb(15, 118, 110)
- HSL
- hsl(175.34 77.44% 26.08%) → hsl(175 77% 26%)
- HWB
- hwb(175 6% 54%)
- OKLCH
- oklch(0.511 0.086 186.4) · oklch(51.1% 0.086 186.4)
- OKLab
- oklab(0.511 -0.086 -0.010)
- Lab (D50)
- lab(44.29 -29.61 -3.80)
- LCH (D50)
- lch(44.29 29.86 187.31)
- Display P3
- color(display-p3 0.2093 0.4557 0.4304)
- Linear sRGB
- color(srgb-linear 0.0048 0.1812 0.1559)
Gamut: sRGB e Display P3
#0F766E é 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.089 e o Display P3 a 0.121; esta cor usa 96% do croma sRGB disponível.
Trechos de CSS
.element {
color: #0f766e;
color: rgb(15 118 110);
color: hsl(175 77% 26%);
color: oklch(0.511 0.086 186.4);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.511 0.086 186.4);
}
/* arbitrary values */
class="text-[#0f766e] bg-[oklch(0.511_0.086_186.4)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.2093 0.4557 0.4304); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #0f766e calc(l - 0.1) c h); }Cores próximas
Cores mais próximas nas paletas do Tailwind e do CSS (distância OKLab).
- teal-700#00786F
- teal#008080
- v3 emerald-700#047857
- emerald-700#007A55
- v3 cyan-700#0E7490
- cyan-700#007595
- darkcyan#008B8B
- teal-800#005F5A
Mais claro e mais escuro, mesmo matiz e croma
- #2B8880 · oklch(0.571 0.086 186.4) · ΔL +0.06
- #00645D · oklch(0.451 0.086 186.4) · ΔL −0.06