OKLCH vers HEX: #C27AFF
Aussi appelée: Tailwind purple-400
Résultat
oklch(0.71003 0.19609 307.109) → #C27AFF
Les valeurs sont données en pleine précision : reconvertir donne exactement #c27aff. La forme arrondie est celle que l’on colle d’habitude dans le CSS.
Calcul pas à pas
Chaque nombre est calculé à partir de l’entrée, rien n’est cherché dans une table.
1. input
oklch(0.71003 0.19609 307.109)
2. OKLCH → Oklab
a = C·cos H = 0.11831 b = C·sin H = -0.15638
3. Oklab → LMS′
l′ = L + 0.3963·a + 0.2158·b = 0.723172 m′ = L − 0.1056·a − 0.0639·b = 0.707527 s′ = L − 0.0895·a − 1.2915·b = 0.901405
4. cube
l = 0.723172³ = 0.378204 m = 0.707527³ = 0.354184 s = 0.901405³ = 0.732420
5. LMS → linear sRGB
R = 4.0767·l − 3.3077·m + 0.2310·s = 0.539468 G = −1.2684·l + 2.6098·m − 0.3413·s = 0.194617 B = −0.0042·l − 0.7034·m + 1.7076·s = 0.999966
6. linear → sRGB, × 255
R = 0.76078 × 255 = 194.00 → 194 G = 0.47843 × 255 = 122.00 → 122 B = 0.99998 × 255 = 255.00 → 255
7. RGB → HEX
#C27AFF
Tous les formats
- HEX
- #c27aff
- RGB
- rgb(194 122 255)
- RGB (legacy)
- rgb(194, 122, 255)
- HSL
- hsl(272.48 100.00% 73.92%) → hsl(272 100% 74%)
- HWB
- hwb(272 48% 0%)
- OKLCH
- oklch(0.710 0.196 307.1) · oklch(71.0% 0.196 307.1)
- OKLab
- oklab(0.710 0.118 -0.156)
- Lab (D50)
- lab(63.36 46.71 -56.09)
- LCH (D50)
- lch(63.36 73.00 309.79)
- Display P3
- color(display-p3 0.7208 0.4913 0.9703)
- Linear sRGB
- color(srgb-linear 0.5395 0.1946 1.0000)
Gamut : sRGB et Display P3
#C27AFF est une couleur hexadécimale : elle est donc dans sRGB et, par conséquent, dans Display P3. À cette luminosité et cette teinte, sRGB atteint une chroma de 0.196 et Display P3 de 0.214 ; cette couleur utilise 100 % de la chroma sRGB disponible.
Extraits CSS
.element {
color: #c27aff;
color: rgb(194 122 255);
color: hsl(272 100% 74%);
color: oklch(0.710 0.196 307.1);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.710 0.196 307.1);
}
/* arbitrary values */
class="text-[#c27aff] bg-[oklch(0.710_0.196_307.1)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.7208 0.4913 0.9703); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #c27aff calc(l - 0.1) c h); }Couleurs proches
Couleurs les plus proches dans les palettes Tailwind et CSS (distance OKLab).
- v3 purple-400#C084FC
- violet-400#A684FF
- v3 violet-400#A78BFA
- v3 fuchsia-400#E879F9
- orchid#DA70D6
- fuchsia-400#ED6AFF
- violet#EE82EE
- v3 purple-500#A855F7
Plus clair et plus foncé, même teinte et même chroma
- #D58DFF · oklch(0.770 0.196 307.1) · ΔL +0.06
- #AF67EA · oklch(0.650 0.196 307.1) · ΔL −0.06