Articulo de referencia

espacio de color Oklab

"},"version":{"wt":""},"version_date":{"wt":"{{Start date|2024|2|13|df=y}} "},"preview":{"wt":""},"preview_date":{"wt":"{{Start date|2024|2|29|df=y}} "},"organization":{"wt":"W3...

El espacio de color Oklab es un espacio de color uniforme para el color independiente del dispositivo, diseñado para mejorar la uniformidad perceptual , la predicción de tono y luminosidad , la mezcla de colores , [ a ] y la usabilidad, al tiempo que garantiza la estabilidad numérica y la facilidad de implementación . [ 1 ] Introducido por Björn Ottosson en diciembre de 2020, Oklab y su contraparte cilíndrica , Oklch , se han incluido en los borradores de CSS Color Level  4 y Level 5 para colores web  independientes del dispositivo desde diciembre de 2021. [ 2 ] [ 3 ] Son compatibles con las versiones recientes de los principales navegadores web [ 6 ] y permiten la especificación de colores dentro de la gama DCI-P3 pero fuera de sRGB . [ 7 ]

El modelo de Oklab se ajusta con datos de apariencia de color mejorados: datos CAM16 para luminosidad y croma, y ​​datos IPT para tono. El nuevo ajuste aborda problemas como cambios inesperados de tono y luminosidad en los colores azules presentes en el espacio de color CIELAB , simplificando la creación de esquemas de color y gradientes de color más suaves . [ 1 ] [ 7 ] [ 4 ]

Como explicó Ottosson, [ 1 ] eligió el nombre Oklab porque el modelo hace un trabajo OK (adecuado) y se basa en las tres coordenadas del espacio de color L , a , y b .

Coordenadas

rueda de colores Oklch

Oklab utiliza la misma estructura espacial que CIELAB, representando el color mediante tres componentes:

  • L representa la luminosidad perceptual, con un rango de 0 (negro puro) a 1 (blanco de referencia, si es acromático), y a menudo se expresa como un porcentaje.
  • a y b para canales opuestos de los cuatro tonos únicos , sin límites pero en la práctica con un rango de −0,5 a +0,5; CSS asigna ±100% a ±0,4 para ambos [ 2 ]
    • a de verde (negativo) a rojo (positivo)
    • b de azul (negativo) a amarillo (positivo)

Al igual que CIELCh , Oklch representa los colores utilizando:

  • L de luminosidad perceptiva
  • C para croma representa la intensidad cromática, con valores desde 0 (acromático) sin límite superior, pero en la práctica sin exceder +0,5; CSS trata +0,4 como 100% [ 2 ]
  • h representa el ángulo de tono en una rueda de color , que normalmente se expresa en grados decimales.
Espacios de color Oklab y Oklch. Los rangos de color mostrados corresponden a la gama Rec. 2020 (una gama RGB amplia).

Colores acromáticos

Los grises neutros , el negro puro y el blanco de referencia son acromáticos, es decir,a=0{\displaystyle a=0},b=0{\displaystyle b=0},do=0{\displaystyle C=0}y h no está definido . Asignar cualquier valor real a su componente de tono no tiene efecto en las conversiones entre espacios de color. [ 2 ]

Diferencias de color

La diferencia de color perceptual en Oklab se calcula como la distancia euclidiana entre las coordenadas ( L , a , b ) . [ 8 ] [ 2 ]

Conversiones entre espacios de color

Conversión hacia y desde Oklch

Al igual que en CIELCh, las coordenadas cartesianas a y b se convierten a las coordenadas polares C y h de la siguiente manera: do=a2+b2,h=atan2(b,a),{\displaystyle {\begin{aligned}C&={\sqrt {a^{2}+b^{2}}},\\h&=\operatorname {atan2} (b,a),\end{aligned}}} y las coordenadas polares se convierten a coordenadas cartesianas de la siguiente manera: a=doporqueh,b=dopecadoh.{\displaystyle {\begin{aligned}a&=C\cos h,\\b&=C\sin h.\end{aligned}}}

Conversión de CIE XYZ

La conversión de CIE XYZ con un iluminante estándar D65 implica: [ 1 ]

  1. Aplicando el mapeo lineal que convierte los valores XYZ en un espacio análogo al espacio de color LMS : [ b ][lmetros]=METRO1[incógnitaYZ].{\displaystyle {\begin{bmatrix}l\\m\\s\end{bmatrix}}=\mathbf {M} _{1}{\begin{bmatrix}X\\Y\\Z\end{bmatrix}}.}
  2. Aplicando una no linealidad de raíz cúbica :[lmetros]=[l1/3metro1/3s1/3].{\displaystyle {\begin{bmatrix}l'\\m'\\s'\end{bmatrix}}={\begin{bmatrix}l^{1/3}\\m^{1/3}\\s^{1/3}\end{bmatrix}}.}
  3. Conversión a Oklab con otro mapa lineal:[Lab]=METRO2[lmetros].{\displaystyle {\begin{bmatrix}L\\a\\b\end{bmatrix}}=\mathbf {M} _{2}{\begin{bmatrix}l'\\m'\\s'\end{bmatrix}}.}

Las matrices de mapeo lineal son METRO1=[0.81893301010,36186674240,12885971370,03298454360,92931187150,03614563870,04820030180,26436626910,6338517070],METRO2=[0,21045425530,79361778500,00407204681.97799849512.42859220500,45059370990,02590403710,78277176620,8086757660].{\displaystyle {\begin{aligned}\mathbf {M} _{1}&={\begin{bmatrix}0.8189330101&{\phantom {-}}0.3618667424&-0.1288597137\\0.0329845436&{\phantom {-}}0.9293118715&{\phantom {-}}0.0361456387\\0.0482003018&{\phantom {-}}0.2643662691&{\phantom {-}}0.6338517070\end{bmatrix}},\\\mathbf {M} _{2}&={\begin{bmatrix}0.2104542553&{\phantom {-}}0.7936177850&-0.0040720468\\1.9779984951&-2.4285922050&{\phantom {-}}0.4505937099\\0.0259040371&{\phantom {-}}0.7827717662&-0.8086757660\end{bmatrix}}.\end{aligned}}}

Conversión desde sRGB

Visualización de valores de color lineales que se corresponden con ubicaciones en espacios de color perceptuales.

La conversión de sRGB requiere primero una conversión de sRGB a CIE XYZ con un iluminante estándar D65. Como el último paso de esta conversión es un mapeo lineal de RGB lineal a CIE XYZ, la implementación de referencia emplea directamente la matriz multiplicada que representa la composición de los dos mapeos lineales: [ 1 ][lmetros]=[0,41222147080,53633253630,05144599290,21190349820,68069954510,10739695660,08830246190,28171883760,6299787005][RlinealGRAMOlinealBlineal].{\displaystyle {\begin{bmatrix}l\\m\\s\end{bmatrix}}={\begin{bmatrix}0.4122214708&0.5363325363&0.0514459929\\0.2119034982&0.6806995451&0.1073969566\\0.0883024619&0.2817188376&0.6299787005\end{bmatrix}}{\begin{bmatrix}R_{\text{linear}}\\G_{\text{linear}}\\B_{\text{linear}}\end{bmatrix}}.}

Conversión a CIE XYZ y sRGB

La conversión a CIE XYZ y sRGB simplemente implica aplicar las funciones inversas respectivas en orden inverso: [ 1 ][lmetros]=METRO21[Lab],[lmetros]=[(l)3(metro)3(s)3],[incógnitaYZ]=METRO11[lmetros].{\displaystyle {\begin{aligned}{\begin{bmatrix}l'\\m'\\s'\end{bmatrix}}&=\mathbf {M} _{2}^{-1}{\begin{bmatrix}L\\a\\b\end{bmatrix}},\\{\begin{bmatrix}l\\m\\s\end{bmatrix}}&={\begin{bmatrix}(l')^{3}\\(m')^{3}\\(s')^{3}\end{bmatrix}},\\{\begin{bmatrix}X\\Y\\Z\end{bmatrix}}&=\mathbf {M} _{1}^{-1}{\begin{bmatrix}l\\m\\s\end{bmatrix}}.\end{aligned}}}

Notas

  1. Sin embargo, no es adecuado parao el procesamiento de imágenes , para lo cual el espacio de color RGB lineal con expansión gamma es más apropiado. [ 4 ] [ 5 ]
  2. El espacio ( l , m , s ) utilizado aquí no es el mismo que el espacio de color LMS , sino un espacio arbitrario que se encontró numéricamente que mejor se ajustaba a los datos de apariencia del color.

Referencias

  1. 1 2 3 4 5 6 7 Ottosson, Björn (23 de diciembre de 2020). "Un espacio de color perceptual para el procesamiento de imágenes" . GitHub Pages . Recuperado el 24 de julio de 2024 .
  2. 1 2 3 4 5 6 Módulo de color CSS Nivel 4 (borrador de recomendación candidata). W3C . Recuperado el 24 de julio de 2024 .
  3. 1 2 Módulo de color CSS Nivel 5 (borrador de trabajo). W3C . Consultado el 25 de julio de 2024 .
  4. 1 2 Levien, Raph (18 de enero de 2021). "Una reseña interactiva de Oklab" . GitHub Pages . Recuperado el 24 de julio de 2024 .
  5. Novak, John (21 de septiembre de 2016). "Lo que todo programador debería saber sobre gamma" . Recuperado el 26 de julio de 2024 .
  6. "Modelo de color Oklab" . ¿Puedo usarlo ? Consultado el 24 de julio de 2024 .
  7. 1 2 Sitnik, Andrey; Turner, Travis (25 de enero de 2023). "OKLCH en CSS: por qué pasamos de RGB y HSL" . Evil Martians . Recuperado el 24 de julio de 2024 .
  8. Lilley, Chris (julio de 2021). "¿Mejor que Lab? Reducción de gama CIE Lab y OKLab" . W3C . Recuperado el 24 de julio de 2024 .
  • Selector y convertidor de color OKLCH por Andrey Sitnik y Roman Shamin