HEX in HSL: #172554
Auch bekannt als: Tailwind v3 blue-950
Ergebnis
#172554 → hsl(226 57% 21%)
Die Werte stehen in voller Genauigkeit, die Rückrechnung ergibt exakt #172554. Die gerundete Form fügst du üblicherweise in CSS ein.
Rechenweg Schritt für Schritt
Jede Zahl wird aus der Eingabe berechnet, nichts ist nachgeschlagen.
1. RGB ÷ 255
R = 0.0902 G = 0.1451 B = 0.3294
2. max, min, Δ
max = 0.3294 min = 0.0902 Δ = max − min = 0.2392
3. L
L = (max + min) / 2 = 0.2098 = 20.98%
4. S
S = Δ / (1 − |2L − 1|) = 0.5701 = 57.01%
5. H
max is B → H = 60° × ((R − G) / Δ + 4) = 60° × ((0.0902 − 0.1451) / 0.2392 + 4) = 226.23°
6. HSL
hsl(226.23 57.01% 20.98%)
Alle Formate
- HEX
- #172554
- RGB
- rgb(23 37 84)
- RGB (legacy)
- rgb(23, 37, 84)
- HSL
- hsl(226.23 57.01% 20.98%) → hsl(226 57% 21%)
- HWB
- hwb(226 9% 67%)
- OKLCH
- oklch(0.282 0.087 267.9) · oklch(28.2% 0.087 267.9)
- OKLab
- oklab(0.282 -0.003 -0.087)
- Lab (D50)
- lab(15.77 8.12 -31.06)
- LCH (D50)
- lch(15.77 32.10 284.65)
- Display P3
- color(display-p3 0.1020 0.1436 0.3175)
- Linear sRGB
- color(srgb-linear 0.0086 0.0185 0.0887)
Gamut: sRGB und Display P3
#172554 ist eine Hex-Farbe und liegt damit in sRGB und folglich in Display P3. Bei dieser Helligkeit und diesem Farbton erreicht sRGB eine Chroma von 0.188, Display P3 von 0.189; diese Farbe nutzt 46 % der verfügbaren sRGB-Chroma.
CSS-Snippets
.element {
color: #172554;
color: rgb(23 37 84);
color: hsl(226 57% 21%);
color: oklch(0.282 0.087 267.9);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.282 0.087 267.9);
}
/* arbitrary values */
class="text-[#172554] bg-[oklch(0.282_0.087_267.9)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.1020 0.1436 0.3175); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #172554 calc(l - 0.1) c h); }Ähnliche Farben
Nächste Farben in den Paletten von Tailwind und CSS (OKLab-Abstand).
- blue-950#162456
- v3 indigo-950#1E1B4B
- indigo-950#1E1A4D
- sky-950#052F4A
- v3 sky-950#082F49
- slate-800#1D293D
- v3 slate-800#1E293B
- gray-800#1E2939
Heller und dunkler, gleicher Farbton und gleiche Chroma
- #253565 · oklch(0.342 0.087 267.9) · ΔL +0.06
- #0A1543 · oklch(0.222 0.087 267.9) · ΔL −0.06