OKLCH in HEX: #F4A460
Noto anche come: CSS sandybrown
Risultato
oklch(0.78400 0.12691 59.710) → #F4A460
I valori sono mostrati a piena precisione, quindi riconvertendo si ottiene esattamente #f4a460. 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
oklch(0.78400 0.12691 59.710)
2. OKLCH → Oklab
a = C·cos H = 0.06401 b = C·sin H = 0.10958
3. Oklab → LMS′
l′ = L + 0.3963·a + 0.2158·b = 0.833019 m′ = L − 0.1056·a − 0.0639·b = 0.770246 s′ = L − 0.0895·a − 1.2915·b = 0.636745
4. cube
l = 0.833019³ = 0.578048 m = 0.770246³ = 0.456970 s = 0.636745³ = 0.258165
5. LMS → linear sRGB
R = 4.0767·l − 3.3077·m + 0.2310·s = 0.904657 G = −1.2684·l + 2.6098·m − 0.3413·s = 0.371246 B = −0.0042·l − 0.7034·m + 1.7076·s = 0.116979
6. linear → sRGB, × 255
R = 0.95686 × 255 = 244.00 → 244 G = 0.64314 × 255 = 164.00 → 164 B = 0.37648 × 255 = 96.00 → 96
7. RGB → HEX
#F4A460
Tutti i formati
- HEX
- #f4a460
- RGB
- rgb(244 164 96)
- RGB (legacy)
- rgb(244, 164, 96)
- HSL
- hsl(27.57 87.06% 66.67%) → hsl(28 87% 67%)
- HWB
- hwb(28 38% 4%)
- OKLCH
- oklch(0.784 0.127 59.7) · oklch(78.4% 0.127 59.7)
- OKLab
- oklab(0.784 0.064 0.110)
- Lab (D50)
- lab(74.48 25.72 47.38)
- LCH (D50)
- lch(74.48 53.91 61.50)
- Display P3
- color(display-p3 0.9113 0.6568 0.4220)
- Linear sRGB
- color(srgb-linear 0.9047 0.3712 0.1170)
Gamut: sRGB e Display P3
#F4A460 è 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.153 e Display P3 a 0.193; questo colore usa il 83% della croma sRGB disponibile.
Snippet CSS
.element {
color: #f4a460;
color: rgb(244 164 96);
color: hsl(28 87% 67%);
color: oklch(0.784 0.127 59.7);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.784 0.127 59.7);
}
/* arbitrary values */
class="text-[#f4a460] bg-[oklch(0.784_0.127_59.7)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.9113 0.6568 0.4220); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #f4a460 calc(l - 0.1) c h); }Colori vicini
I colori più vicini nelle palette Tailwind e CSS (distanza OKLab).
- lightsalmon#FFA07A
- v3 orange-400#FB923C
- v3 amber-500#F59E0B
- amber-500#FE9A00
- orange-300#FFB86A
- orange#FFA500
- v3 orange-300#FDBA74
- darksalmon#E9967A
Più chiaro e più scuro, stessa tonalità e croma
- #FFB773 · oklch(0.844 0.127 59.7) · ΔL +0.06
- #E0914D · oklch(0.724 0.127 59.7) · ΔL −0.06