Colores en CSS: por qué hemos cambiado RGB y HSL por OKLCH [ENG]

La nueva especificación CSS Color 4 ha agregado la nueva notación de OKLCH para declarar colores. En OKLCH existen varios parámetros: "l c h" o "l c h / a", donde cada uno es: L es la luminosidad percibida (0-1). "Percibido" significa que tiene una luminosidad constante para nuestros ojos, a diferencia de L en HSL. C es el croma, desde el color gris hasta el color más saturado. H es el ángulo de tono (0-360). A es opacidad (0-1 o 0-100%).

[#1 frg]

Acabo de aprender a poner hsl en los colores de CSS, ¡y me lo cambian!

[#2 mr_b]

#1 Del propio artículo, traducido (por DeepL), una muy buena explicación de cómo funciona:

• L es la luminosidad percibida. Va de 0 (negro) a 1 (blanco). También admite porcentajes (de 0 % a 100 %), pero el % no funciona en calc() ni en colores relativos.
• C es la cromaticidad, la saturación del color. Va de 0 (gris) a infinito. En la práctica, hay un límite, pero depende de la gama de colores de la pantalla (los colores P3 tendrán valores mayores que los sRGB) y cada tono

…   

[#4 frg]

#2 Se leer. Me jode tener que cambiar todo el CSS que acabo de generar.

[#6 Benzo]

#4 github.com/fpetrakov/convert-to-oklch

[#8 frg]

#6 Primera prueba rápida. FAIL

Ha dejado todo en blanco y negro

[#9 Benzo]

#8 Te ha quedado versión vintage

[#3 Ka0]

#1 Es peor, OKLCH es la evolución de LCH (cie LAB), no de HSL. Y seguro que habran mas cambios, es como cuando tienes un documento que quieres arreglar pero no lo quieres tirar y le añades un Ok al final del nombre, pero como sigues haciendo cagadas, después haces otro con la coletilla, final y luego otro con este Si y otro con definitivo….

[#5 frg]

#3 Me da hasta pereza mirar más sobre el tema. Creo voy a dejar todo en hsl y rgb sin migrar.

¡Qué pereza!  

[#15 dilsexico]

#3 Final_final_use this one_v3_document.indd

[#12 mcfgdbbn3]

Excusas para inflar más Internet, que una página web no baje de 4 Gb de memoria y el navegador ocupe como mínimo 32 Gb.

Ojalá se lo tiren o no se lleve a cabo, pero me imagino que habrá muchos intereses económicos.

[#17 PerritaPiloto]

#12 #13 Esto llevo diez años haciéndolo para generar efectos en matrices led con HSV.
Así que mi workflow no va a cambiar demasiado. Para dar o quitar saturación, o hacer un barrido de color sigue siendo superior. A efectos prácticos necesitas memoria por cada pixel, para almacenar cuatro valores en lugar de tres valores. Y esto, en los dispositivos son soporte nativo para cualquier espacio de color y un canal alfa, sigue ocupando lo mismo. Cuando las animaciones son procedirales ocupa muy…   

[#7 Ne0]

Perooooo, en que nos afecta esto a los hombre si solo distinguimos 16 colores?

[#10 covacho]

#7 16 colores dice. Todo el mundo sabe que son 8 colores, si contamos el blanco y el negro.

[#11 Ne0]

#10 A ver!! que me he criado con 2 hermanas y una de ellas es costurera, algo he debido de aprender!!

[#16 PerritaPiloto]

#11 Si, que si la tela no es de la misma tintada que otra con la misma referencia, es posible que haya variación en el color. Así que en el orillo aparece a veces tanto la referencia al modelo de la tela como a la tintada.

[#13 aPedirAlMetro]

"Unlike rgb() or hex (#ca0000), OKLCH is human readable"
Mis cojones.
Veamos un color rojo puro por ejemplo, en RGB: rgb(255, 0, 0)
Ahora el mismo color en OKLCH: oklch(0.628 0.2577 29.23)

SI alguien considera el segundo mas entendible a simple vista que el primero, es que no es de este planeta

"OKLCH frees designers from the need to manually choose every color. Designers can define a formula, choose a few colors, and an entire design system palette is automatically generated."
Diseñadores definiendo formulas

[#14 reivaj01]

#13 color: red;
Esto si que era "human readable"