Qu’est-ce que LCH Colour?

LCH est l’abréviation de lightness, chroma et hue. Il s’agit d’un espace colorimétrique conçu pour répondre à certaines des limitations du RVB. Il s’agit d’une version à coordonnées polaires de l’espace colorimétrique CIELAB, qui est un modèle de couleur conçu pour être plus uniforme sur le plan perceptuel que le RVB. Cela signifie que les couleurs qui sont proches les unes des autres dans l’espace colorimétrique sont plus similaires les unes aux autres en termes de perception par l’œil humain.

Le dégradé LCH offre une transition plus douce entre les deux couleurs et une gamme de couleurs plus large.

LCH a également une luminosité plus constante sur l’ensemble du dégradé, ce qui facilite la création de transitions fluides entre les couleurs.

Pourquoi OKLCH a-t-il remplacé LCH?

L’espace colorimétrique OKLCH est une variante de l’espace colorimétrique LCH qui est conçu pour être plus uniforme sur le plan perceptuel que LCH.

Syntaxe OKLCH

Légèreté

La valeur de luminosité est comprise entre 0 et 1 ou est utilisée comme pourcentage. Les nuances de gris se situent entre les deux.

Chrominance

La chrominance détermine la saturation des couleurs. Une valeur de chrominance de 0 donne une couleur neutre (quelle que soit la luminosité), des valeurs plus élevées intensifient la vivacité de la couleur jusqu’aux limites de l’espace colorimétrique.

Teinte

La teinte est représentée sous la forme d’un angle en degrés compris entre 0 et 360 pour déterminer la couleur à partir d’une roue chromatique.

Transparence alpha

CSS Level 4 introduit également une nouvelle syntaxe pour la transparence alpha, en utilisant une barre oblique après les paramètres de couleur

Ajout d’une solution de secours pour les broswers qui ne prennent pas en charge la syntaxe
color:orange;
color:oklch(79% 0.17 70 / 100 );with alpha

Une autre façon d’utiliser oklch

Il suffit d’ajouter ‘in oklch’ à la direction du dégradé et de laisser le navigateur gérer la transformation
background-image:linear-gradient
90degin oklch,
red0%,
orange100%
);

Prise en charge du navigateur OKLCH

OKLCH est largement pris en charge dans les navigateurs modernes, et c’est un excellent choix pour la conception de sites Web et d’autres applications de conception numérique. Il est également pris en charge dans les dernières versions d’outils de conception populaires, tels qu’Adobe Photoshop et Illustrator.