Sélecteur et Convertisseur de Couleurs

Modèles de couleurs

Un modèle de couleur est un système permettant de décrire les couleurs sous forme de nombres. Différents modèles sont utilisés selon que la sortie est un écran, une imprimante ou une spécification de design.

RGB / RGBA

Format

RGB définit les couleurs en mélangeant la lumière rouge, verte et bleue. Chaque canal va de 0 à 255. rgb(255, 0, 0) est du rouge pur. rgb(255, 255, 255) est du blanc. Le canal A (alpha) ajoute la transparence, allant de 0 (totalement transparent) à 1 (totalement opaque). Par exemple, rgba(255, 0, 0, 0.5) est du rouge semi-transparent. RGB est le modèle de couleur natif des écrans et affichages numériques.

Historique

Le modèle RGB est enraciné dans la théorie de la vision trichromatique de Young-Helmholtz du XIXe siècle. James Clerk Maxwell a mené les premières expériences de photographie en couleurs RGB en 1861. RGB est devenu le standard des affichages électroniques avec le développement des téléviseurs couleur à tube cathodique dans les années 1930 et 1940, et a ensuite été adopté pour les moniteurs d'ordinateur. L'espace colorimétrique sRGB a été formellement adopté comme standard web dans HTML 3.2 en janvier 1997.

HEX / HEXA

Format

HEX est une notation compacte des valeurs RGB en hexadécimal. #FF0000 est identique à rgb(255, 0, 0). Chaque paire de chiffres hexadécimaux représente un canal : #RRGGBB. La forme à 8 chiffres #RRGGBBAA ajoute un canal alpha, où 00 est totalement transparent et FF est totalement opaque. Par exemple, #FF000080 est du rouge à 50 % d'opacité. Les formes abrégées comme #F00 s'étendent à #FF0000.

Historique

La notation hexadécimale des couleurs est née dans les premiers navigateurs web au milieu des années 1990. Les premières versions de Mosaic et Netscape Navigator ont hérité du système de noms de couleurs X11. CSS Level 1, publié en décembre 1996 par Hakon Wium Lie et Bert Bos, a formellement standardisé les triplets hexadécimaux comme méthode principale de spécification des couleurs sur le web.

HSL / HSLA

Format

HSL décrit la couleur par teinte, saturation et luminosité. La teinte est un degré sur le cercle chromatique (0-360) : 0 est rouge, 120 est vert, 240 est bleu. La saturation (0-100 %) contrôle l'intensité de la couleur. La luminosité (0-100 %) contrôle la clarté, où 0 % est noir et 100 % est blanc. HSL est souvent plus intuitif que RGB pour sélectionner des couleurs car on peut ajuster la luminosité et la saturation indépendamment.

Historique

HSL a été décrit pour la première fois par George H. Joblove et Donald Greenberg dans un article de 1978 dans Computer Graphics. Il a été créé pour résoudre un problème fondamental de RGB : mélanger des valeurs de rouge, vert et bleu n'est pas intuitif pour les humains. HSL réorganise l'espace colorimétrique RGB afin que les artistes et designers puissent raisonner en termes de couleur (teinte), de vivacité (saturation) et de clarté (luminosité), ce qui correspond davantage à la façon dont les gens décrivent naturellement les couleurs.

HSV / HSB

Format

HSV (teinte, saturation, valeur) est similaire à HSL mais utilise la « valeur » (luminosité) au lieu de la luminosité. À 100 % de valeur, les couleurs pleinement saturées sont pures et vives. HSV correspond plus naturellement au fonctionnement des sélecteurs de couleurs : le panneau saturation/luminosité ajuste S et V tandis que le curseur de teinte ajuste H.

Historique

HSV a été décrit par Alvy Ray Smith en août 1978 alors qu'il travaillait au laboratoire d'infographie du New York Institute of Technology. Il a été publié dans le même numéro de Computer Graphics que HSL. Smith a conçu HSV pour une utilisation dans un programme de peinture numérique précoce, où les artistes avaient besoin d'un moyen intuitif de sélectionner des couleurs à l'écran. Le modèle cylindrique de HSV en a fait un choix naturel pour un sélecteur de couleurs avec un curseur de teinte et un panneau saturation/luminosité.

CMYK

Format

CMYK (cyan, magenta, jaune, noir/key) est utilisé en impression. Alors que RGB est additif (lumière), CMYK est soustractif (encre). Chaque valeur représente le pourcentage d'encre appliqué. cmyk(0, 100, 100, 0) produit du rouge. La conversion entre RGB et CMYK est approximative car ils couvrent des gammes de couleurs (gamuts) différentes.

Historique

Les fondements de CMYK remontent à Jacob Christoph Le Blon, qui a inventé l'impression couleur en demi-teinte en utilisant des plaques de cuivre séparées vers 1710. Il utilisait initialement des plaques rouge, jaune et bleue, et a ajouté plus tard une plaque noire pour des contours et du texte plus nets. Le processus moderne CMYK à quatre couleurs a été mis en œuvre pour la première fois dans les années 1890 pour les illustrations en couleur des journaux. La plaque noire est appelée plaque « key » (clé) car elle porte le détail fin sur lequel les autres plaques sont alignées.

Formats de couleurs CSS

Le CSS moderne prend en charge plusieurs notations de couleurs :

• #FF5733 ou #ff5733 (HEX)
• rgb(255, 87, 51) ou rgba(255, 87, 51, 0.5)
• hsl(14, 100%, 60%) ou hsla(14, 100%, 60%, 0.5)
• Couleurs nommées : red, cornflowerblue, rebeccapurple (148 couleurs nommées au total)