OKLCH Studio

OKLCH in HEX: #C71585

Auch bekannt als: CSS mediumvioletred

Ergebnis

oklch(0.55337 0.22165 349.687) → #C71585

Die Werte stehen in voller Genauigkeit, die Rückrechnung ergibt exakt #c71585. 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. 1. input

    oklch(0.55337 0.22165 349.687)

  2. 2. OKLCH → Oklab

    a = C·cos H = 0.21807
b = C·sin H = -0.03968

  3. 3. Oklab → LMS′

    l′ = L + 0.3963·a + 0.2158·b = 0.631236
m′ = L − 0.1056·a − 0.0639·b = 0.532884
s′ = L − 0.0895·a − 1.2915·b = 0.585104

  4. 4. cube

    l = 0.631236³ = 0.251521
m = 0.532884³ = 0.151321
s = 0.585104³ = 0.200308

  5. 5. LMS → linear sRGB

    R = 4.0767·l − 3.3077·m + 0.2310·s = 0.571127
G = −1.2684·l + 2.6098·m − 0.3413·s = 0.007502
B = −0.0042·l − 0.7034·m + 1.7076·s = 0.234552

  6. 6. linear → sRGB, × 255

    R = 0.78039 × 255 = 199.00 → 199
G = 0.08238 × 255 = 21.01 → 21
B = 0.52157 × 255 = 133.00 → 133

  7. 7. RGB → HEX

    #C71585

Alle Formate

HEX
#c71585
RGB
rgb(199 21 133)
RGB (legacy)
rgb(199, 21, 133)
HSL
hsl(322.25 80.91% 43.14%) → hsl(322 81% 43%)
HWB
hwb(322 8% 22%)
OKLCH
oklch(0.553 0.222 349.7) · oklch(55.3% 0.222 349.7)
OKLab
oklab(0.553 0.218 -0.040)
Lab (D50)
lab(45.17 69.57 -14.07)
LCH (D50)
lch(45.17 70.97 348.57)
Display P3
color(display-p3 0.7160 0.1763 0.5105)
Linear sRGB
color(srgb-linear 0.5711 0.0075 0.2346)

Gamut: sRGB und Display P3

#C71585 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.231, Display P3 von 0.259; diese Farbe nutzt 96 % der verfügbaren sRGB-Chroma.

CSS-Snippets

.element {
  color: #c71585;
  color: rgb(199 21 133);
  color: hsl(322 81% 43%);
  color: oklch(0.553 0.222 349.7);
}

/* Tailwind CSS v4 */
@theme {
  --color-brand: oklch(0.553 0.222 349.7);
}
/* arbitrary values */
class="text-[#c71585] bg-[oklch(0.553_0.222_349.7)]"

/* wide-gamut screens */
@media (color-gamut: p3) {
  .element { color: color(display-p3 0.7160 0.1763 0.5105); }
}

/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #c71585 calc(l - 0.1) c h); }

Ähnliche Farben

Nächste Farben in den Paletten von Tailwind und CSS (OKLab-Abstand).

Heller und dunkler, gleicher Farbton und gleiche Chroma

  • #DC3397 · oklch(0.613 0.222 349.7) · ΔL +0.06
  • #B20073 · oklch(0.493 0.222 349.7) · ΔL −0.06

Im Studio öffnen

Im OKLCH-Farbwähler öffnenKontrast auf Weiß prüfen

Weitere Umrechner für diese Farbe

Alle Umrechner →