pictavie.net - Tutorial

Les couleurs

Il existe 16 couleurs principales. Notez que ces couleurs ont un nom littéral (en anglais, malheureusement).

Exemple : page-05.htm

Mais il est possible de définir les couleurs avec beaucoup plus de précision.

Il faut savoir que chaque couleur (c'est le principe de la télévision) est issue d'un mélange de 3 couleurs principales : le rouge, le vert et le bleu, codifiées RGB (red-green-blue).

Chaque couleur principale est codifiée sur 2 caractères indiquant le pourcentage en langage hexa-décimal (de 00 à FF au lieu de 0 à 100). Ainsi, 00=0%, 33=20%, 66=40%, 99=60%, CC=80%, FF=100% et tout ce qu'on peut imaginer d'intermédiaire.
En RGB, une couleur sera donc codifiée sur 6 caractères précédés du signe # (dièse).

Exemple : page-06.htm

Pour obtenir des nuances de gris, il suffit d'avoir un poids identique pour chacun des paramètres rouge, vert et bleu.
Par exemple :

`#FFFFFF white`	`#EEEEEE`	`#DDDDDD`	`#CCCCCC`	`#BBBBBB`	`#AAAAAA`	`#999999`	`#888888`
`#777777`	`#666666`	`#555555`	`#444444`	`#333333`	`#222222`	`#111111`	`#000000 black`

Ou encore :

`#F0F0F0`	`#E0E0E0`	`#D0D0D0`	`#C0C0C0`	`#B0B0B0`	`#A0A0A0`	`#909090`	`#808080`
`#707070`	`#606060`	`#505050`	`#404040`	`#303030`	`#202020`	`#101010`	`#000000`

Si vous voulez des nuances de bleus, jouez sur le code bleu (la troisième paire de chiffres du code) :

#0000EE #0000DD #0000CC #0000BB #0000AA #000099 #000066 #000033

Les couleurs peuvent également être définies par un nom littéral plutôt que par un code RGB. Ainsi la couleur codifiée "#4682B4" se nomme en réalité "steelblue".

Si vous le souhaitez, vous pouvez télécharger ici un exécutable au format ZIP (ou consulter cette même page ici) vous présentant les 140 couleurs possédant un nom littéral et reconnues par tous les navigateurs. Mais je ne vous conseille pas d'utiliser les noms de couleurs en lieu et place des codes de couleurs: ce procédé n'est pas fiable.

Dans votre document HTML, la ligne ainsi rédigée :

<FONT color="#4682B4">Ce texte est écrit avec la <B>couleur steelblue</B>.</FONT>

affichera ceci dans votre navigateur :

Ce texte est écrit avec la couleur steelblue.