Bon, ben on y va alors. On commence avec un peu de lecture :
http://fr.wikipedia.org/wiki/Couleurs_du_Web
Tout cela te donne les bases pour comprendre comment se forme une couleur RGB (
Red, Green, Blue => Rouge, Vert, Bleu) : il s'agit de 3 valeurs entières, chacune comprise entre 0 et 255, représentant respectivement l'intensité de la couleur sur chacun des trois canaux de base qui, mélangés, permettent de faire n'importe quelle couleur sur ton écran. Le triplet 0;0;0 est le noir pur (absence totale de couleur), le triplet 255;255;255 est le blanc pur.
Sur le web, ces trois composantes sont exprimées en hexadécimal (tout simplement des symboles mathématiques en base 16), ce qui fait qu'une couleur web "complète" est toujours exprimée sur 6 caractères (chiffres de 0 à 9 et lettres de A à F), les deux premiers donnant la valeur rouge de cette couleur, et ainsi de suite. Autrement dit, notre noir pur se note #000000 (facile !) et le blanc #FFFFFF.
Si tu m'as bien suivi, tu as déjà compris que le rouge vif se note #FF0000, et ainsi de suite...
Comme compter en hexadécimal n'est pas très pratique, voici deux fonctions php qui vont beaucoup t'aider à manipuler tout ça :
De l'hexadécimal vers le décimal :
http://fr3.php.net/hexdec
Du décimal vers l'hexadécimal :
http://fr3.php.net/dechex
Le fait de savoir tout ça te permet déjà de faire des dégradés de couleur en pur html à l'aide de calculs simples. Mais on va devoir aller plus loin car ça ne suffit pas (ou alors pas sans mal...) pour afficher un arc-en-ciel
--
Il existe une autre façon d'exprimer une couleur déterminée à l'aide de nombres entiers, les graphistes connaissent ce système sous le nom de HSL (
Hue, Saturation, Lightness, => Teinte, Saturation, Luminosité).
Tout comme pour le système RVB, ce sont trois nombres entiers dont la valeur est comprise entre 0 et 255, la combinaison des trois définissant une couleur précise. En revanche, on ne peut pas les traduire directement en code de couleur pour le web, il faut passer la couleur en RVB pour cela.
La meilleure explication que j'en ai trouvé (avec les formules mathématiques qui permettent de passer d'une couleur exprimée en HSL à une couleur RVB) est malheusement en anglais et se trouve ici :
http://en.wikipedia.org/wiki/HSL_and_HSV . Intéresse toi tout particulièrement à la teinte (Hue).
Pourquoi c'est important ? Parceque la teinte te permet de faire varier la couleur en passant par tout le spectre de l'arc-en-ciel, ce que fait toute palette de couleurs digne de ce nom. Les valeurs de saturation et de luminosité sont moins importantes, tu peux les adapter (ou les forcer) suivant tes besoins.
Si ce n'est pas très clair, n'hésite pas à jouer avec la palette de ton éditeur d'images favori (The Gimp, photoshop, paint shop pro, ...) pour voir un peu comment tout ça se comporte quand tu passes du rouge au noir, du vert au jaune, du bleu au blanc...
--
Bon, peut-être que c'est déjà pas mal à avaler d'un coup tout ça non ?
Dans l'ordre, il faut donc :
- Générer des triplets (de simples tableaux php de trois valeurs numériques seront parfaits) correspondant à des valeurs HSL de (
n,255,255). Il te faudra faire varier
n entre 0 et 255 pour obtenir un bel arc-en-ciel.
- Coder la fonction permettant de passer d'un triplet HSL à un triplet RVB
- Coder la fonction permettant de passer d'un triplet RVB à un code couleur web
- Utiliser les 255 couleurs obtenues de façon jolie dans ta page
Prochaine étape, coder tout ça en PHP
Bon, ben on y va alors. On commence avec un peu de lecture :
http://fr.wikipedia.org/wiki/Couleurs_du_Web
Tout cela te donne les bases pour comprendre comment se forme une couleur RGB ([i]Red, Green, Blue[/i] => Rouge, Vert, Bleu) : il s'agit de 3 valeurs entières, chacune comprise entre 0 et 255, représentant respectivement l'intensité de la couleur sur chacun des trois canaux de base qui, mélangés, permettent de faire n'importe quelle couleur sur ton écran. Le triplet 0;0;0 est le noir pur (absence totale de couleur), le triplet 255;255;255 est le blanc pur.
Sur le web, ces trois composantes sont exprimées en hexadécimal (tout simplement des symboles mathématiques en base 16), ce qui fait qu'une couleur web "complète" est toujours exprimée sur 6 caractères (chiffres de 0 à 9 et lettres de A à F), les deux premiers donnant la valeur rouge de cette couleur, et ainsi de suite. Autrement dit, notre noir pur se note #000000 (facile !) et le blanc #FFFFFF.
Si tu m'as bien suivi, tu as déjà compris que le rouge vif se note #FF0000, et ainsi de suite...
Comme compter en hexadécimal n'est pas très pratique, voici deux fonctions php qui vont beaucoup t'aider à manipuler tout ça :
De l'hexadécimal vers le décimal : http://fr3.php.net/hexdec
Du décimal vers l'hexadécimal : http://fr3.php.net/dechex
Le fait de savoir tout ça te permet déjà de faire des dégradés de couleur en pur html à l'aide de calculs simples. Mais on va devoir aller plus loin car ça ne suffit pas (ou alors pas sans mal...) pour afficher un arc-en-ciel ;-)
--
Il existe une autre façon d'exprimer une couleur déterminée à l'aide de nombres entiers, les graphistes connaissent ce système sous le nom de HSL ([i]Hue, Saturation, Lightness[/i], => Teinte, Saturation, Luminosité).
Tout comme pour le système RVB, ce sont trois nombres entiers dont la valeur est comprise entre 0 et 255, la combinaison des trois définissant une couleur précise. En revanche, on ne peut pas les traduire directement en code de couleur pour le web, il faut passer la couleur en RVB pour cela.
La meilleure explication que j'en ai trouvé (avec les formules mathématiques qui permettent de passer d'une couleur exprimée en HSL à une couleur RVB) est malheusement en anglais et se trouve ici : http://en.wikipedia.org/wiki/HSL_and_HSV . Intéresse toi tout particulièrement à la teinte (Hue).
Pourquoi c'est important ? Parceque la teinte te permet de faire varier la couleur en passant par tout le spectre de l'arc-en-ciel, ce que fait toute palette de couleurs digne de ce nom. Les valeurs de saturation et de luminosité sont moins importantes, tu peux les adapter (ou les forcer) suivant tes besoins.
Si ce n'est pas très clair, n'hésite pas à jouer avec la palette de ton éditeur d'images favori (The Gimp, photoshop, paint shop pro, ...) pour voir un peu comment tout ça se comporte quand tu passes du rouge au noir, du vert au jaune, du bleu au blanc...
--
Bon, peut-être que c'est déjà pas mal à avaler d'un coup tout ça non ? :lol:
Dans l'ordre, il faut donc :
- Générer des triplets (de simples tableaux php de trois valeurs numériques seront parfaits) correspondant à des valeurs HSL de ([b]n[/b],255,255). Il te faudra faire varier [b]n[/b] entre 0 et 255 pour obtenir un bel arc-en-ciel.
- Coder la fonction permettant de passer d'un triplet HSL à un triplet RVB
- Coder la fonction permettant de passer d'un triplet RVB à un code couleur web
- Utiliser les 255 couleurs obtenues de façon jolie dans ta page
Prochaine étape, coder tout ça en PHP ;-)
