OKLCH in HEX: #F5F5F5
Noto anche come: Tailwind neutral-100, Tailwind v3 neutral-100, CSS whitesmoke
Risultato
oklch(0.97015 0.00000 0.000) → #F5F5F5
I valori sono mostrati a piena precisione, quindi riconvertendo si ottiene esattamente #f5f5f5. 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.97015 0.00000 0.000)
2. OKLCH → Oklab
a = C·cos H = 0.00000 b = C·sin H = 0.00000
3. Oklab → LMS′
l′ = L + 0.3963·a + 0.2158·b = 0.970150 m′ = L − 0.1056·a − 0.0639·b = 0.970150 s′ = L − 0.0895·a − 1.2915·b = 0.970150
4. cube
l = 0.970150³ = 0.913096 m = 0.970150³ = 0.913096 s = 0.970150³ = 0.913096
5. LMS → linear sRGB
R = 4.0767·l − 3.3077·m + 0.2310·s = 0.913096 G = −1.2684·l + 2.6098·m − 0.3413·s = 0.913096 B = −0.0042·l − 0.7034·m + 1.7076·s = 0.913096
6. linear → sRGB, × 255
R = 0.96078 × 255 = 245.00 → 245 G = 0.96078 × 255 = 245.00 → 245 B = 0.96078 × 255 = 245.00 → 245
7. RGB → HEX
#F5F5F5
Tutti i formati
- HEX
- #f5f5f5
- RGB
- rgb(245 245 245)
- RGB (legacy)
- rgb(245, 245, 245)
- HSL
- hsl(0.00 0.00% 96.08%) → hsl(0 0% 96%)
- HWB
- hwb(0 96% 4%)
- OKLCH
- oklch(0.970 0.000 0.0) · oklch(97.0% 0.000 0.0)
- OKLab
- oklab(0.970 0.000 0.000)
- Lab (D50)
- lab(96.54 0.00 0.00)
- LCH (D50)
- lch(96.54 0.00 0.00)
- Display P3
- color(display-p3 0.9608 0.9608 0.9608)
- Linear sRGB
- color(srgb-linear 0.9131 0.9131 0.9131)
Gamut: sRGB e Display P3
#F5F5F5 è 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.016 e Display P3 a 0.021; questo colore usa il 0% della croma sRGB disponibile.
Snippet CSS
.element {
color: #f5f5f5;
color: rgb(245 245 245);
color: hsl(0 0% 96%);
color: oklch(0.970 0.000 0.0);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.970 0.000 0.0);
}
/* arbitrary values */
class="text-[#f5f5f5] bg-[oklch(0.970_0.000_0.0)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.9608 0.9608 0.9608); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #f5f5f5 calc(l - 0.1) c h); }Colori vicini
I colori più vicini nelle palette Tailwind e CSS (distanza OKLab).
- stone-100#F5F5F4
- zinc-100#F4F4F5
- gray-100#F3F4F6
- olive-100#F4F4F0
- slate-100#F1F5F9
- mist-100#F1F3F3
- mauve-100#F3F1F3
- taupe-100#F3F1F1
Più chiaro e più scuro, stessa tonalità e croma
- #FFFFFF · oklch(1.000 0.000 0.0) · ΔL +0.06
- #E1E1E1 · oklch(0.910 0.000 0.0) · ΔL −0.06