Vous êtes sur la page 1sur 18

Couleur du Web

Les couleurs du Web désignent les couleurs utilisées dans l'affichage des pages web, ainsi que les méthodes pour définir (par des
combinaisons de teintes) et référencer (par unnom de couleur) ces couleurs.

Les auteurs de pages web peuvent spécifier les couleurs des éléments qui composent un document web de plusieurs manières : par un
code agglutinant les valeurs hexadécimales RGB ; par un triplet donnant ces valeurs en décimal de 0 à 255 ou par un pourcentage ;
par des références Teinte Saturation Luminosité. Des noms de code basés sur une désignation en anglais peuvent rappeler plus de
deux cents codes de couleur. Souvent un outil de gestion des couleurs ou un autre logiciel graphique est utilisé pour générer la valeur
numérique de la couleur souhaitée.

Les premières versions de Mosaic et du navigateur Netscape utilisaient les noms des couleurs X11 comme base pour leur liste de
couleurs, puisque les deux logiciels ont commencé comme applicationsX Window System.

Les écrans d'ordinateur peuvent suivre la recommandation sRGB, qui définit la colorimétrie des luminophores, une courbe de
gamma, le point blanc, et l'environnement de visionnage. Seuls les écrans conformes avec le réglage adéquat et les conditions de
éclairage environnant spécifiées donnent exactement les résultats prévus. Les écrans les moins chers ne sont pas souvent conformes,
et l'optimisation pour la lecture des pages web les éloigne des réglages permettant le meilleur rendu des couleurs, tandis que
l'environnement des écrans n'est pas toujours favorable. Si ces conditions ne sont pas remplies, le rendu n'est qu’assez proche du
résultat attendu.

Sommaire
Codage informatique des couleurs
Triplet hexadécimal
Notation courte avec trois chiffres hexadécimaux
Noms des couleurs HTML
Noms de couleurs SVG 1.0
Modèles de couleurs standards HSL et HSV en CSS 1.0 et supérieur
Couleurs garanties sur le web
Tableau de couleur
Couleurs vraiment garanties pour le web
Couleurs utilisées dans les CSS
Accessibilité
Voir aussi
Bibliographie
Articles connexes
Notes et références

Codage informatique des couleurs

Triplet hexadécimal
Un triplet hexadécimal est un nombre hexadécimal à 6 chiffres mémorisé sur trois octets utilisé en HTML et dans les feuilles de
style en cascade (CSS), et d'autres applications, pour représenter les couleurs. Les octets représentent les composantes rouge, vert et
bleu de la couleur. Un octet représente l'intervalle entre 00 et FF (en notation hexadécimale), ou 0 à 255 en notation décimale. Le
triplet hexadécimal est formé par la concaténation de trois octets en notation hexadécimale, dans l'ordre rouge-vert-bleu. Les trois
a
groupes de deux chiffres hexadécimaux se suivent sans espace après un croisillon . Les zéros initiaux, non significatifs, doivent
figurer, pour garder le nombre de chiffres dans les triplets égal à six. Par exemple, le triplet 0,1,2 devrait être représenté par le code
#000102.

exemple
Exemple :
La nuance de bleu qu'on obtient avec les valeurs décimales rouge:36, vert:104, bleu:160 se code avec les
b
hexadécimaux 0x24, 0x68 et 0xA0 .

Ce système peut produire 256 × 256 × 256 = 16 777 216 codes différents. C'est beaucoup plus que le nombre de couleurs qu'on peut
distinguer dans le gamut des écrans dans les meilleures conditions possibles.

Notation courte avec trois chiffres hexadécimaux


1
La recommandation CSS permet une notation plus courte basée sur un seul chiffre hexadécimal par couleur . La correspondance
avec le triplet à six chiffres s'effectue en doublant chaque chiffre.

Exemple de notation 3 hex :


Le programme interprète le code#09C comme #0099CC :

.trois-chiffres { color: #09C; }


.six-chiffres { color: #0099CC ; } /*correspond à la même couleur*/

Avec seulement trois chiffres hexadécimaux, il n'y a que 16×16×16, soit 4 096 codes de couleur. Ce nombre de couleurs est suffisant
pour la plupart des usages graphiques, c'est-à-dire en dehors de la reproduction des images.

Cette notation est définie par la recommandation CSS, mais pas par le standard HTML. L'utilisation de cette notation raccourcie
2
ailleurs que dans les feuilles de style, l'élément HTML style ou un attribut style n'est pas valide pour certains navigateurs.

Toutes les couleurs ayant une valeur comprise entre#000000 et #FFFFFF (16 777 216 couleurs) sont valides.

Noms des couleurs HTML


3
La spécification du HTML 4.01 définit 16 couleurs nommées appelées par 18 mots-clés en anglais (il y a deux paires de
4
synonymes), et dont l'emploi n'est pas sensible à la casse. (Les traductions en français entre parenthèses sont indicatives et ne sont
pas des attributs valides en HTML.) Ces attributs et la valeur hexadécimale de rouge-vert-bleu équivalente sont, par ordre
alphabétique :

Valeur Couleur Valeur Couleur Valeur Couleur Valeur Couleur

#00FFFF aqua / cyan #008000 green #000080 navy #C0C0C0 silver


(bleu-vert eau) (vert) (bleu marine) (argent)

#000000 black #808080 gray #808000 olive #008080 teal


(noir) (gris) (jaune olive) (sarcelle)

#0000FF blue #00FF00 lime #800080 purple #FFFFFF white


(bleu) (vert citron) (violet) (blanc)

#FF00FF fuchsia / magenta #800000 maroon #FF0000 red #FFFF00 yellow


(fuchsia) (bordeaux) (rouge) (jaune)
Ces couleurs sont incluses dans les spécifications du HTML 3.0 qui fait remarquer que « Ces couleurs sont issues des 16 couleurs
5
standards supportées avec la paletteVGA Windows. »

Noms de couleurs SVG 1.0


Par ailleurs, un certain nombre de couleurs sont définies par les navigateurs web. Un navigateur particulier pourrait ne pas
reconnaître toutes ces couleurs, mais depuis 2005 tous les navigateurs modernes d'utilisation courante ont avalisé la liste complète.
Beaucoup de ces couleurs sont issues de la liste des noms de couleur X11 fournie par le système de fenêtrage X. Ces couleurs ont été
normalisées par SVG 1.0, et sont reconnues par les visiteursSVG Full. Elles ne font pas partie deSVG Tiny.

Les noms utilisés dans le framework .NET sont quasiment identiques, dans les énumérations Color et KnownColor. La seule couleur
différente est DarkSeaGreen qui est définie comme 8F, BC, 8B (à la place de 8F, BC, 8F).

La liste de couleurs réellement définies avec X11 varie selon les réalisations, et entre en conflit avec un certain nombre de noms
HTML comme c'est le cas pour le vert (green). Pour cette raison, la liste des couleurs que l'on trouve dans X11 (c'est-à-dire
6
/usr/lib/X11/rgb.txt) ne devrait pas être directement utilisée pour choisir des couleurs pour le web.

La liste des « couleurs X11 » du web de la spécification du CSS3, ainsi que leurs équivalents hexadécimaux et décimaux, est
7, 8
présentée ci-dessous .

Code Code Code Code


Code Code
hex. hex. Nom HTML hex. déc.
Nom HTML déc. Nom HTML déc.
RV RV RVB RVB
RVB RVB
B B Couleurs marron
Couleurs rouges Couleurs vertes 255
FF F8
CD AD Cornsilk 248
205 92 173 DC
IndianRed 5C GreenYellow FF 220
92 255 47
5C 2F 255
FF EB
240 7F 127 BlanchedAlmond 235
F0 80 Chartreuse CD
LightCoral 128 FF 00 255 0 205
80
128 7C 255
124 FF E4
250 LawnGreen FC Bisque 228
FA 252 0 C4
Salmon 128 00 196
80 72
114 00 FF 0 255 255
Lime FF DE
E9 233 00 0 NavajoWhite 222
AD
DarkSalmon 96 150 32 173
7A 122 50 205
LimeGreen CD 245
50 F5 DE
FF 255 32 Wheat 222
B3
LightSalmon A0 160 98 152 179
7A 122 PaleGreen FB 251 222
DE B8
DC 98 152 BurlyWood 184
220 20 87
Crimson 14 90 144 135
60
3C LightGreen EE 238 210
D2 B4
FF 255 0 90 144 Tan 180
Red 8C
00 00 0 00 FA 0 250 140
MediumSpringGreen
B2 178 34 9A 154 188
FireBrick BC 8F
22 22 34 00 FF 0 255 RosyBrown 143
SpringGreen 8F
8B 139 0 7F 127 143
DarkRed
00 00 0 3C 60 179 F4 A4 244
MediumSeaGreen SandyBrown
80 00 128 0 B3 71 113 60 164 96
Maroon
00 0 2E 46 139 DA A5 218
SeaGreen Goldenrod
FF 255 8B 57 87 20 165 32
Pink C0 192 22 8B 34 139 B8 86 184
ForestGreen DarkGoldenrod
CB 203 22 34 0B 134 11
FF 255 00 80 0 128 CD 85 205
Green Peru
LightPink B6 182 00 0 3F 133 63
C1 193 D2 69 210
D2 69 210
FF 255 DarkGreen 00 64 0 100 Chocolate 1E 105 30
HotPink 69 105 00 0 8B 45 139 69
B4 180 SaddleBrown
9A 13 19
154
FF 255 20 YellowGreen CD A0 52 160 82
DeepPink 205 50 Sienna
14 93 147 32 2D 45
C7 199 21 6B 107 A5 2A 165 42
MediumVioletRed OliveDrab Brown
15 85 133 8E 23 142 35 2A 42
219 80 80 128 Couleurs blanches
DB Olive
PaleVioletRed 112 00 128 0
70 93 255
147 55 6B 85 107 FF FF
DarkOliveGreen White 255
Couleurs orange 2F 47 FF
255
FF 255 66 102
MediumAquamarine CD 205 255
LightSalmon A0 160 FF FA
AA 170 Snow 250
7A 122 FA
250
FF 255 8F 143
Coral DarkSeaGreen BC 188 240
7F 50 127 80 F0 FF
8F 143 Honeydew 255
F0
FF 255 99 240
Tomato 20 B2 32 178
63 47 71 LightSeaGreen 245
AA 170 F5 FF
FF 255 69 MintCream 255
OrangeRed 00 8B 0 139 FA
45 00 0 DarkCyan 250
8B 139
FF 240
255 00 80 0 128 F0 FF
DarkOrange 8C Teal Azure 255
140 0 80 128 FF
00 255
FF Couleurs bleues 240
255 F0 F8
Orange A5 00 FF 0 255 AliceBlue 248
165 0 Aqua FF
00 FF 255 255
Couleurs jaunes 00 FF 0 255 248
Cyan F8 F8
FF 255 GhostWhite 248
FF FF
255 255
Gold D7 E0 224
215 0 LightCyan FF 255 245
00 F5 F5
FF 255 WhiteSmoke 245
FF F5
255 245
Yellow FF AF 175
255 0 PaleTurquoise EE 238 255
00 FF F5
EE 238 Seashell 245
FF 255 EE
238
LightYellow FF 255 7F 127
E0 224 Aquamarine FF 255 245
F5 F5
D4 212 Beige 245
FF 255 DC
220
LemonChiffon FA 250 40 E0 64 224
Turquoise 253
CD 205 D0 208 FD F5
OldLace 245
FA 250 48 E6
72 209 230
LightGoldenrodYellow FA 250 MediumTurquoise D1
204 255
D2 210 CC FF FA
FloralWhite 250
FF 255 00 F0
0 206 240
PapayaWhip EF 239 DarkTurquoise CE
209 255
D5 213 D1 FF FF
Ivory 255
FF 255 5F F0
95 158 240
Moccasin E4 228 CadetBlue 9E
160 250
B5 181 A0 FA EB
AntiqueWhite 235
FF 255 46 82 70 130 D7
SteelBlue 215
PeachPuff DA 218 B4 180
B9 185 250
B0 176 FA F0
Linen 240
EE 238 LightSteelBlue C4 196 E6
230
PaleGoldenrod E8 232 DE 222
AA 170 255
B0 176 FF F0
LavenderBlush 240
F0 240 PowderBlue E0 224 F5
245
Khaki E6 230 E6 230
8C 140 255
AD 173 FF E4
MistyRose 228
DarkKhaki BD 189 LightBlue D8 216 E1
225
B7 183 E6 230
B7 183
6B 107 87 135 Couleurs grises
SkyBlue CE 206
Couleurs violettes DC 220
EB 235
E6 230 Gainsboro DC 220
87 135 DC 220
Lavender E6 230 LightSkyBlue CE 206
FA 250 FA 250 211
D3 D3
D8 216 LightGrey 211
00 D3
Thistle BF 191 0 191 211
DeepSkyBlue BF
D8 216 255 192
FF C0 C0
DD 221 Silver 192
1E 90 30 144 C0
Plum A0 160 DodgerBlue 192
FF 255
DD 221 169
100 A9 A9
EE 238 64 95 DarkGray 169
CornflowerBlue 149 A9
Violet 82 130 ED 169
237
EE 238 128
123 80 80
DA 218 7B 68 Gray 128
MediumSlateBlue 104 80
Orchid 70 112 EE 128
238
D6 214 105
41 69 65 105 69 69
FF RoyalBlue DimGray 105
255 0 E1 225 69
Fuchsia 00 105
255 00 00 0 0
FF Blue 119
FF 255 77 88
FF LightSlateGray 136
255 0 00 00 0 0 99
Magenta 00 MediumBlue 153
255 CD 205
FF 112
00 00 0 0 70 80
BA DarkBlue SlateGray 128
186 85 8B 139 90
MediumOrchid 55 144
211 00 00 0 0
D3 Navy 2F 4F 47 79
80 128 DarkSlateGray
147 4F 79
93 70 19 19 25 25
MediumPurple 112 MidnightBlue 00 00
DB 70 112 Black 000
219 00
8A
138 43
BlueViolet 2B
226
E2
94 00 148 0
DarkViolet
D3 211
99 32 153 50
DarkOrchid
CC 204
8B
139 0
DarkMagenta 00
139
8B
80 00 128 0
Purple
80 128
4B 75 0
Indigo
00 82 130
6A
106 90
SlateBlue 5A
205
CD
48
72 61
DarkSlateBlue 3D
139
8B

Modèles de couleurs standards HSL et HSV en CSS 1.0 et supérieur


CSS prend en charge (aussi bien pour les documents HTML ou les images SVG) trois modèles colorimétriques : le modèle sRGB
(soit décimal, soit hexadécimal avec une variante abrégée à trois chiffres lorsque les 3 composantes sont des multiples de 17), le
modèle HSL et le modèle HSV (ces deux modèles sont exprimés en degrés et pourcentages). Les 138 couleurs standards prédéfinies
en CSS 1.0 sont des couleurs pleines sans transparence (CSS permet également le modèle sRGBA avec une composante alpha dont la
9
valeur est 100% dans le modèle sRGB), leur correspondance sont dans le tableau suivant.
La table est ordonnée en montrant d’abords les niveaux de gris (dont la composante H dans le modèle HSV est non significative car
elles sont totalement insaturée avec L=0 dans le modèle HSL), puis dans l’ordre des trois composantes HSV (en commençant par les
tons rouges avec H>330° puis H=0 pour le rouge lui-même, jusqu’aux tons violets avec H≤330°, dans l’ordre de l’arc-en-ciel) ; elle
montre également les synonymes reconnus pour les noms de couleurs (noter qu'en CSS les couleurs sont documentées entièrement en
minuscules, bien que leur casse ne soit pas significative en CSS). Toutes les 138 couleurs sont prédéfinies également dans les images
SVG et toutes standardisées en HTML5 .

Noter également que dans les modèles HSL (TSL en français) et HSV (TSV en français), les composantes H (tonalité sur le cercle
des couleurs) sont identiques, mais pas les composantes S codant différemment la saturation ; la composante L du modèle HSL
correspond mieux à la notion de luminosité que la composante V (valeur) du modèle HSV (dont le calcul est plus simple et ne
désigne que l'intensité de la plus lumineuse des 3 composantes RGB en ignorant l'intensité des deux autres). La table montre
également les correspondances avec le modèle CMYK utilisé en impression.
RGB RGB
Nom(s) de couleur Échantillon HSL (° et %) HSV (° et %) CMYK (%)
(hex) (décimal)
rgb(0, 0, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
black #000
0) 0%) 0%) 0%, 100%)
rgb(105, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
dimgray, dimgrey #696969
105, 105) 41.2%) 41.2%) 0%, 58.8%)
rgb(128, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
gray, grey #808080
128, 128) 50.2%) 50.2%) 0%, 49.8%)
rgb(169, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
darkgray, darkgrey #A9A9A9
169, 169) 66.3%) 66.3%) 0%, 33.7%)
rgb(192, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
silver #C0C0C0
192, 192) 75.3%) 75.3%) 0%, 24.7%)
rgb(211, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
lightgray, lightgrey #D3D3D3
211, 211) 82.7%) 82.7%) 0%, 17.3%)
rgb(220, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
gainsboro #DCDCDC
220, 220) 86.3%) 86.3%) 0%, 13.7%)
rgb(245, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
whitesmoke #F5F5F5
245, 245) 96.1%) 96.1%) 0%, 3.9%)
rgb(255, hsl(0, 0%, hsv(0, 0%, cmyk(0%, 0%,
white #FFF
255, 255) 100%) 100%) 0%, 0%)
rgb(128, hsl(0, 100%, hsv(0, 100%, cmyk(0%, 100%,
maroon #800000
0, 0) 25.1%) 50.2%) 100%, 49.8%)
rgb(139, hsl(0, 100%, hsv(0, 100%, cmyk(0%, 100%,
darkred #8B0000
0, 0) 27.3%) 54.5%) 100%, 45.5%)
rgb(255, hsl(0, 100%, hsv(0, 100%, cmyk(0%, 100%,
red #F00
0, 0) 50%) 100%) 100%, 0%)
rgb(178, hsl(0, 67.9%, hsv(0, 80.9%, cmyk(0%, 80.9%,
firebrick #B22222
34, 34) 41.6%) 69.8%) 80.9%, 30.2%)
rgb(165, hsl(0, 59.4%, hsv(0, 74.5%, cmyk(0%, 74.5%,
brown #A52A2A
42, 42) 40.6%) 64.7%) 74.5%, 35.3%)
rgb(205, hsl(0, 53.1%, hsv(0, 55.1%, cmyk(0%, 55.1%,
indianred #CD5C5C
92, 92) 58.2%) 80.4%) 55.1%, 19.6%)
rgb(240, hsl(0, 78.9%, hsv(0, 46.7%, cmyk(0%, 46.7%,
lightcoral #F08080
128, 128) 72.2%) 94.1%) 46.7%, 5.9%)
rgb(188, hsl(0, 25.1%, hsv(0, 23.9%, cmyk(0%, 23.9%,
rosybrown #BC8F8F
143, 143) 64.9%) 73.7%) 23.9%, 26.3%)
rgb(255, hsl(0, 100%, hsv(0, 2%, cmyk(0%, 2%,
snow #FFFAFA
250, 250) 99%) 100%) 2%, 0%)
rgb(255, hsl(6, 100%, hsv(6, 11.8%, cmyk(0%, 10.6%,
mistyrose #FFE4E1
228, 225) 94.1%) 100%) 11.8%, 0%)
hsl(6.2,
rgb(250, hsv(6.2, cmyk(0%, 48.8%,
salmon #FA8072 93.2%,
128, 114) 54.4%, 98%) 54.4%, 2%)
71.4%)
hsl(9.1, hsv(9.1,
rgb(255, cmyk(0%, 61.2%,
tomato #FF6347 100%, 72.2%,
99, 71) 72.2%, 0%)
63.9%) 100%)
hsl(15.1, hsv(15.1,
rgb(233, cmyk(0%, 35.6%,
darksalmon #E9967A 71.6%, 47.6%,
150, 122) 47.6%, 8.6%)
69.6%) 91.4%)
hsl(16.1, hsv(16.1,
rgb(255, cmyk(0%, 50.2%,
coral #FF7F50 100%, 68.6%,
127, 80) 68.6%, 0%)
65.7%) 100%)
orangered #FF4500 rgb(255, hsl(16.2, hsv(16.2, cmyk(0%, 72.9%,
69, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsl(17.1, hsv(17.1,
rgb(255, cmyk(0%, 37.3%,
lightsalmon #FFA07A 100%, 52.2%,
160, 122) 52.2%, 0%)
73.9%) 100%)
hsl(19.3, hsv(19.3,
rgb(160, cmyk(0%, 48.8%,
sienna #A0522D 56.1%, 71.9%,
82, 45) 71.9%, 37.3%)
40.2%) 62.7%)
hsl(24.7,
rgb(255, hsv(24.7, cmyk(0%, 3.9%,
seashell #FFF5EE 100%,
245, 238) 6.7%, 100%) 6.7%, 0%)
96.7%)
hsv(25,
rgb(139, hsl(25, cmyk(0%, 50.4%,
saddlebrown #8B4513 86.3%,
69, 19) 75.9%, 31%) 86.3%, 45.5%)
54.5%)
hsv(25,
rgb(210, hsl(25, 75%, cmyk(0%, 50%,
chocolate #D2691E 85.7%,
105, 30) 47.1%) 85.7%, 17.6%)
82.4%)
hsl(27.6, hsv(27.6,
rgb(244, cmyk(0%, 32.8%,
sandybrown #F4A460 87.1%, 60.7%,
164, 96) 60.7%, 4.3%)
66.7%) 95.7%)
hsl(28.3, hsv(28.3,
rgb(255, cmyk(0%, 14.5%,
peachpuff #FFDAB9 100%, 27.5%,
218, 185) 27.5%, 0%)
86.3%) 100%)
hsl(29.6, hsv(29.6,
rgb(205, cmyk(0%, 35.1%,
peru #CD853F 58.7%, 69.3%,
133, 63) 69.3%, 19.6%)
52.5%) 80.4%)
hsl(30,
rgb(250, hsv(30, 8%, cmyk(0%, 4%,
linen #FAF0E6 66.7%,
240, 230) 98%) 8%, 2%)
94.1%)
hsl(32.5, hsv(32.5,
rgb(255, cmyk(0%, 10.6%,
bisque #FFE4C4 100%, 23.1%,
228, 196) 23.1%, 0%)
88.4%) 100%)
rgb(255, hsl(32.9, hsv(32.9, cmyk(0%, 45.1%,
darkorange #FF8C00
140, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsv(33.8,
rgb(222, hsl(33.8, cmyk(0%, 17.1%,
burlywood #DEB887 39.2%,
184, 135) 56.9%, 70%) 39.2%, 12.9%)
87.1%)
hsl(34.3, hsv(34.3,
rgb(210, cmyk(0%, 14.3%,
tan #D2B48C 43.8%, 33.3%,
180, 140) 33.3%, 17.6%)
68.6%) 82.4%)
hsl(34.3,
rgb(250, hsv(34.3, cmyk(0%, 6%,
antiquewhite #FAEBD7 77.8%,
235, 215) 14%, 98%) 14%, 2%)
91.2%)
hsl(35.9, hsv(35.9,
rgb(255, cmyk(0%, 12.9%,
navajowhite #FFDEAD 100%, 32.2%,
222, 173) 32.2%, 0%)
83.9%) 100%)
hsl(36, hsv(36,
rgb(255, cmyk(0%, 7.8%,
blanchedalmond #FFEBCD 100%, 19.6%,
235, 205) 19.6%, 0%)
90.2%) 100%)
hsl(37.1, hsv(37.1,
rgb(255, cmyk(0%, 6.3%,
papayawhip #FFEFD5 100%, 16.5%,
239, 213) 16.5%, 0%)
91.8%) 100%)
hsl(38.1,
rgb(255, hsv(38.1, cmyk(0%, 10.6%,
moccasin #FFE4B5 100%,
228, 181) 29%, 100%) 29%, 0%)
85.5%)
orange #FFA500 rgb(255, hsl(38.8, hsv(38.8, cmyk(0%, 35.3%,
165, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsl(39.1, hsv(39.1,
rgb(245, cmyk(0%, 9.4%,
wheat #F5DEB3 76.7%, 26.9%,
222, 179) 26.9%, 3.9%)
83.1%) 96.1%)
hsl(39.1,
rgb(253, hsv(39.1, cmyk(0%, 3.2%,
oldlace #FDF5E6 85.2%,
245, 230) 9.1%, 99.2%) 9.1%, 0.8%)
94.7%)
hsl(40,
rgb(255, hsv(40, 5.9%, cmyk(0%, 2%,
floralwhite #FFFAF0 100%,
250, 240) 100%) 5.9%, 0%)
97.1%)
hsl(42.7,
rgb(184, hsv(42.7, cmyk(0%, 27.2%,
darkgoldenrod #B8860B 88.7%,
134, 11) 94%, 72.2%) 94%, 27.8%)
38.2%)
hsv(42.9,
rgb(218, hsl(42.9, cmyk(0%, 24.3%,
goldenrod #DAA520 85.3%,
165, 32) 74.4%, 49%) 85.3%, 14.5%)
85.5%)
hsl(48, hsv(48,
rgb(255, cmyk(0%, 2.7%,
cornsilk #FFF8DC 100%, 13.7%,
248, 220) 13.7%, 0%)
93.1%) 100%)
rgb(255, hsl(50.6, hsv(50.6, cmyk(0%, 15.7%,
gold #FFD700
215, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsl(54, hsv(54,
rgb(240, cmyk(0%, 4.2%,
khaki #F0E68C 76.9%, 41.7%,
230, 140) 41.7%, 5.9%)
74.5%) 94.1%)
hsl(54, hsv(54,
rgb(255, cmyk(0%, 2%,
lemonchiffon #FFFACD 100%, 19.6%,
250, 205) 19.6%, 0%)
90.2%) 100%)
hsv(54.7,
rgb(238, hsl(54.7, cmyk(0%, 2.5%,
palegoldenrod #EEE8AA 28.6%,
232, 170) 66.7%, 80%) 28.6%, 6.7%)
93.3%)
hsv(55.6,
rgb(189, hsl(55.6, cmyk(0%, 3.2%,
darkkhaki #BDB76B 43.4%,
183, 107) 38.3%, 58%) 43.4%, 25.9%)
74.1%)
hsl(60, hsv(60,
rgb(128, cmyk(0%, 0%,
olive #808000 100%, 100%,
128, 0) 100%, 49.8%)
25.1%) 50.2%)
rgb(255, hsl(60, hsv(60, cmyk(0%, 0%,
yellow #FF0
255, 0) 100%, 50%) 100%, 100%) 100%, 0%)
rgb(250, hsl(60, 80%, hsv(60, 16%, cmyk(0%, 0%,
lightgoldenrodyellow #FAFAD2
250, 210) 90.2%) 98%) 16%, 2%)
hsl(60, hsv(60,
rgb(255, cmyk(0%, 0%,
lightyellow #FFFFE0 100%, 12.2%,
255, 224) 12.2%, 0%)
93.9%) 100%)
hsl(60, hsv(60,
rgb(245, cmyk(0%, 0%,
beige #F5F5DC 55.6%, 10.2%,
245, 220) 10.2%, 3.9%)
91.2%) 96.1%)
hsl(60,
rgb(255, hsv(60, 5.9%, cmyk(0%, 0%,
ivory #FFFFF0 100%,
255, 240) 100%) 5.9%, 0%)
97.1%)
hsl(79.6, hsv(79.6,
rgb(107, cmyk(24.6%, 0%,
olivedrab #6B8E23 60.5%, 75.4%,
142, 35) 75.4%, 44.3%)
34.7%) 55.7%)
yellowgreen #9ACD32 rgb(154, hsl(79.7, hsv(79.7, cmyk(24.9%, 0%,
205, 50) 60.8%, 50%) 75.6%, 75.6%, 19.6%)
80.4%)
rgb(85, hsl(82, 39%, hsv(82, cmyk(20.6%, 0%,
darkolivegreen #556B2F
107, 47) 30.2%) 56.1%, 42%) 56.1%, 58%)
hsl(83.7, hsv(83.7,
rgb(173, cmyk(32.2%, 0%,
greenyellow #ADFF2F 100%, 81.6%,
255, 47) 81.6%, 0%)
59.2%) 100%)
rgb(127, hsl(90.1, hsv(90.1, cmyk(50.2%, 0%,
chartreuse #7FFF00
255, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsl(90.5, hsv(90.5,
rgb(124, cmyk(50.8%, 0%,
lawngreen #7CFC00 100%, 100%,
252, 0) 100%, 1.2%)
49.4%) 98.8%)
hsl(120, hsv(120,
rgb(0, cmyk(100%, 0%,
darkgreen #006400 100%, 100%,
100, 0) 100%, 60.8%)
19.6%) 39.2%)
hsl(120, hsv(120,
rgb(0, cmyk(100%, 0%,
green #008000 100%, 100%,
128, 0) 100%, 49.8%)
25.1%) 50.2%)
rgb(0, hsl(120, hsv(120, cmyk(100%, 0%,
lime #0F0
255, 0) 100%, 50%) 100%, 100%) 100%, 0%)
hsv(120,
rgb(50, hsl(120, cmyk(75.6%, 0%,
limegreen #32CD32 75.6%,
205, 50) 60.8%, 50%) 75.6%, 19.6%)
80.4%)
hsl(120, hsv(120,
rgb(34, cmyk(75.5%, 0%,
forestgreen #228B22 60.7%, 75.5%,
139, 34) 75.5%, 45.5%)
33.9%) 54.5%)
hsl(120, hsv(120,
rgb(144, cmyk(39.5%, 0%,
lightgreen #90EE90 73.4%, 39.5%,
238, 144) 39.5%, 6.7%)
74.9%) 93.3%)
hsv(120,
rgb(152, hsl(120, cmyk(39.4%, 0%,
palegreen #98FB98 39.4%,
251, 152) 92.5%, 79%) 39.4%, 1.6%)
98.4%)
hsl(120, hsv(120,
rgb(143, cmyk(23.9%, 0%,
darkseagreen #8FBC8F 25.1%, 23.9%,
188, 143) 23.9%, 26.3%)
64.9%) 73.7%)
hsl(120,
rgb(240, hsv(120, cmyk(5.9%, 0%,
honeydew #F0FFF0 100%,
255, 240) 5.9%, 100%) 5.9%, 0%)
97.1%)
hsl(146.5, hsv(146.5,
rgb(46, cmyk(66.9%, 0%,
seagreen #2E8B57 50.3%, 66.9%,
139, 87) 37.4%, 45.5%)
36.3%) 54.5%)
hsl(146.7, hsv(146.7,
rgb(60, cmyk(66.5%, 0%,
mediumseagreen #3CB371 49.8%, 66.5%,
179, 113) 36.9%, 29.8%)
46.9%) 70.2%)
rgb(0, hsl(149.9, hsv(149.9, cmyk(100%, 0%,
springgreen #00FF7F
255, 127) 100%, 50%) 100%, 100%) 50.2%, 0%)
rgb(245, hsl(150, hsv(150, cmyk(3.9%, 0%,
mintcream #F5FFFA
255, 250) 100%, 98%) 3.9%, 100%) 2%, 0%)
rgb(0, hsl(157, hsv(157, cmyk(100%, 0%,
mediumspringgreen #00FA9A
250, 154) 100%, 49%) 100%, 98%) 38.4%, 2%)
hsl(159.6, hsv(159.6,
rgb(102, cmyk(50.2%, 0%,
mediumaquamarine #66CDAA 50.7%, 50.2%,
205, 170) 17.1%, 19.6%)
60.2%) 80.4%)
aquamarine #7FFFD4 rgb(127, hsl(159.8, hsv(159.8, cmyk(50.2%, 0%,
255, 212) 100%, 50.2%, 16.9%, 0%)
74.9%) 100%)
hsl(174, hsv(174,
rgb(64, cmyk(71.4%, 0%,
turquoise #40E0D0 72.1%, 71.4%,
224, 208) 7.1%, 12.2%)
56.5%) 87.8%)
hsl(176.7,
rgb(32, hsv(176.7, cmyk(82%, 0%,
lightseagreen #20B2AA 69.5%,
178, 170) 82%, 69.8%) 4.5%, 30.2%)
41.2%)
hsl(177.8,
rgb(72, hsv(177.8, cmyk(65.6%, 0%,
mediumturquoise #48D1CC 59.8%,
209, 204) 65.6%, 82%) 2.4%, 18%)
55.1%)
hsl(180, hsv(180,
rgb(0, cmyk(100%, 0%,
teal #008080 100%, 100%,
128, 128) 0%, 49.8%)
25.1%) 50.2%)
hsl(180, hsv(180,
rgb(0, cmyk(100%, 0%,
darkcyan #008B8B 100%, 100%,
139, 139) 0%, 45.5%)
27.3%) 54.5%)
rgb(0, hsl(180, hsv(180, cmyk(100%, 0%,
aqua, cyan #0FF
255, 255) 100%, 50%) 100%, 100%) 0%, 0%)
hsl(180,
darkslategray, rgb(47, hsv(180, cmyk(40.5%, 0%,
#2F4F4F 25.4%,
darkslategrey 79, 79) 40.5%, 31%) 0%, 69%)
24.7%)
hsv(180,
rgb(175, hsl(180, cmyk(26.5%, 0%,
paleturquoise #AFEEEE 26.5%,
238, 238) 64.9%, 81%) 0%, 6.7%)
93.3%)
hsl(180, hsv(180,
rgb(224, cmyk(12.2%, 0%,
lightcyan #E0FFFF 100%, 12.2%,
255, 255) 0%, 0%)
93.9%) 100%)
hsl(180,
rgb(240, hsv(180, cmyk(5.9%, 0%,
azure #F0FFFF 100%,
255, 255) 5.9%, 100%) 0%, 0%)
97.1%)
rgb(0, hsl(180.9, hsv(180.9, cmyk(100%,
darkturquoise #00CED1
206, 209) 100%, 41%) 100%, 82%) 1.4%, 0%, 18%)
hsv(181.8,
rgb(95, hsl(181.8, cmyk(40.6%,
cadetblue #5F9EA0 40.6%,
158, 160) 25.5%, 50%) 1.3%, 0%, 37.3%)
62.7%)
hsl(186.7, hsv(186.7,
rgb(176, cmyk(23.5%,
powderblue #B0E0E6 51.9%, 23.5%,
224, 230) 2.6%, 0%, 9.8%)
79.6%) 90.2%)
hsv(194.7,
rgb(173, hsl(194.7, cmyk(24.8%,
lightblue #ADD8E6 24.8%,
216, 230) 53.3%, 79%) 6.1%, 0%, 9.8%)
90.2%)
rgb(0, hsl(195.1, hsv(195.1, cmyk(100%,
deepskyblue #00BFFF
191, 255) 100%, 50%) 100%, 100%) 25.1%, 0%, 0%)
hsl(197.4, hsv(197.4,
rgb(135, cmyk(42.6%,
skyblue #87CEEB 71.4%, 42.6%,
206, 235) 12.3%, 0%, 7.8%)
72.5%) 92.2%)
rgb(135, hsl(203, hsv(203, cmyk(46%,
lightskyblue #87CEFA
206, 250) 92%, 75.5%) 46%, 98%) 17.6%, 0%, 2%)
hsv(207.3, cmyk(61.1%,
rgb(70, hsl(207.3,
steelblue #4682B4 61.1%, 27.8%, 0%,
130, 180) 44%, 49%)
70.6%) 29.4%)
hsl(208,
rgb(240, hsv(208, cmyk(5.9%, 2.7%,
aliceblue #F0F8FF 100%,
248, 255) 5.9%, 100%) 0%, 0%)
97.1%)
dodgerblue #1E90FF rgb(30, hsl(209.6, hsv(209.6, cmyk(88.2%,
144, 255) 100%, 88.2%, 43.5%, 0%, 0%)
55.9%) 100%)
hsl(210, hsv(210, cmyk(22.2%,
rgb(112,
slategray, slategrey #708090 12.6%, 22.2%, 11.1%, 0%,
128, 144)
50.2%) 56.5%) 43.5%)
hsl(210,
lightslategray, rgb(119, hsv(210, cmyk(22.2%,
#789 14.3%,
lightslategrey 136, 153) 22.2%, 60%) 11.1%, 0%, 40%)
53.3%)
hsv(213.9, cmyk(20.7%,
rgb(176, hsl(213.9,
lightsteelblue #B0C4DE 20.7%, 11.7%, 0%,
196, 222) 41.1%, 78%)
87.1%) 12.9%)
hsl(218.5, hsv(218.5,
rgb(100, cmyk(57.8%,
cornflowerblue #6495ED 79.2%, 57.8%,
149, 237) 37.1%, 0%, 7.1%)
66.1%) 92.9%)
hsl(225, hsv(225, cmyk(71.1%,
rgb(65,
royalblue #4169E1 72.7%, 71.1%, 53.3%, 0%,
105, 225)
56.9%) 88.2%) 11.8%)
hsl(240, hsv(240, cmyk(100%,
rgb(0, 0,
navy #000080 100%, 100%, 100%, 0%,
128)
25.1%) 50.2%) 49.8%)
hsl(240, hsv(240, cmyk(100%,
rgb(0, 0,
darkblue #00008B 100%, 100%, 100%, 0%,
139)
27.3%) 54.5%) 45.5%)
hsl(240, hsv(240, cmyk(100%,
rgb(0, 0,
mediumblue #0000CD 100%, 100%, 100%, 0%,
205)
40.2%) 80.4%) 19.6%)
rgb(0, 0, hsl(240, hsv(240, cmyk(100%,
blue #00F
255) 100%, 50%) 100%, 100%) 100%, 0%, 0%)
hsl(240, hsv(240, cmyk(77.7%,
rgb(25,
midnightblue #191970 63.5%, 77.7%, 77.7%, 0%,
25, 112)
26.9%) 43.9%) 56.1%)
hsl(240,
rgb(230, hsv(240, 8%, cmyk(8%, 8%,
lavender #E6E6FA 66.7%,
230, 250) 98%) 0%, 2%)
94.1%)
hsl(240,
rgb(248, hsv(240, cmyk(2.7%, 2.7%,
ghostwhite #F8F8FF 100%,
248, 255) 2.7%, 100%) 0%, 0%)
98.6%)
hsl(248.3, hsv(248.3, cmyk(48.3%,
rgb(106,
slateblue #6A5ACD 53.5%, 56.1%, 56.1%, 0%,
90, 205)
57.8%) 80.4%) 19.6%)
hsl(248.5, hsv(248.5,
rgb(123, cmyk(48.3%,
mediumslateblue #7B68EE 79.8%, 56.3%,
104, 238) 56.3%, 0%, 6.7%)
67.1%) 93.3%)
hsv(248.5, cmyk(48.2%,
rgb(72, hsl(248.5,
darkslateblue #483D8B 56.1%, 56.1%, 0%,
61, 139) 39%, 39.2%)
54.5%) 45.5%)
hsl(259.6, hsv(259.6, cmyk(32.9%,
rgb(147,
mediumpurple #9370DB 59.8%, 48.9%, 48.9%, 0%,
112, 219)
64.9%) 85.9%) 14.1%)
hsl(271.1,
rgb(138, hsv(271.1, cmyk(38.9%,
blueviolet #8A2BE2 75.9%,
43, 226) 81%, 88.6%) 81%, 0%, 11.4%)
52.7%)
hsl(274.6,
rgb(75, 0, hsv(274.6, cmyk(42.3%,
indigo #4B0082 100%,
130) 100%, 51%) 100%, 0%, 49%)
25.5%)
darkorchid #9932CC rgb(153, hsl(280.1, hsv(280.1, cmyk(25%,
50, 204) 60.6%, 75.5%, 80%) 75.5%, 0%, 20%)
49.8%)
hsl(282.1, hsv(282.1, cmyk(29.9%,
rgb(148,
darkviolet #9400D3 100%, 100%, 100%, 0%,
0, 211)
41.4%) 82.7%) 17.3%)
hsv(288.1, cmyk(11.8%,
rgb(186, hsl(288.1,
mediumorchid #BA55D3 59.7%, 59.7%, 0%,
85, 211) 58.9%, 58%)
82.7%) 17.3%)
hsl(300, hsv(300,
rgb(128, cmyk(0%, 100%,
purple #800080 100%, 100%,
0, 128) 0%, 49.8%)
25.1%) 50.2%)
hsl(300, hsv(300,
rgb(139, cmyk(0%, 100%,
darkmagenta #8B008B 100%, 100%,
0, 139) 0%, 45.5%)
27.3%) 54.5%)
rgb(255, hsl(300, hsv(300, cmyk(0%, 100%,
fuchsia, magenta #F0F
0, 255) 100%, 50%) 100%, 100%) 0%, 0%)
hsl(300, hsv(300,
rgb(238, cmyk(0%, 45.4%,
violet #EE82EE 76.1%, 45.4%,
130, 238) 0%, 6.7%)
72.2%) 93.3%)
hsl(300, hsv(300,
rgb(221, cmyk(0%, 27.6%,
plum #DDA0DD 47.3%, 27.6%,
160, 221) 0%, 13.3%)
74.7%) 86.7%)
hsl(300, hsv(300,
rgb(216, cmyk(0%, 11.6%,
thistle #D8BFD8 24.3%, 11.6%,
191, 216) 0%, 15.3%)
79.8%) 84.7%)
hsl(302.3, hsv(302.3,
rgb(218, cmyk(0%, 48.6%,
orchid #DA70D6 58.9%, 48.6%,
112, 214) 1.8%, 14.5%)
64.7%) 85.5%)
hsl(322.2,
rgb(199, hsv(322.2, cmyk(0%, 89.4%,
mediumvioletred #C71585 80.9%,
21, 133) 89.4%, 78%) 33.2%, 22%)
43.1%)
hsl(327.6, hsv(327.6,
rgb(255, cmyk(0%, 92.2%,
deeppink #FF1493 100%, 92.2%,
20, 147) 42.4%, 0%)
53.9%) 100%)
hsl(330, hsv(330,
rgb(255, cmyk(0%, 58.8%,
hotpink #FF69B4 100%, 58.8%,
105, 180) 29.4%, 0%)
70.6%) 100%)
hsl(340,
rgb(255, hsv(340, cmyk(0%, 5.9%,
lavenderblush #FFF0F5 100%,
240, 245) 5.9%, 100%) 3.9%, 0%)
97.1%)
hsl(340.4, hsv(340.4,
rgb(219, cmyk(0%, 48.9%,
palevioletred #DB7093 59.8%, 48.9%,
112, 147) 32.9%, 14.1%)
64.9%) 85.9%)
hsl(348, hsv(348,
rgb(220, cmyk(0%, 90.9%,
crimson #DC143C 83.3%, 90.9%,
20, 60) 72.7%, 13.7%)
47.1%) 86.3%)
hsl(349.5, hsv(349.5,
rgb(255, cmyk(0%, 24.7%,
pink #FFC0CB 100%, 24.7%,
192, 203) 20.4%, 0%)
87.6%) 100%)
hsl(351, hsv(351,
rgb(255, cmyk(0%, 28.6%,
lightpink #FFB6C1 100%, 28.6%,
182, 193) 24.3%, 0%)
85.7%) 100%)

Couleurs garanties sur le web


Un autre ensemble de 216 valeurs de couleurs est généralement considérée comme la palette de couleurs garanties sur le web (web-
safe colors) conçue alors que de nombreux moniteurs n'étaient capables d'afficher que 256 couleurs. Un ensemble de couleurs, qui
pouvaient être affichées sans tramage sur les écrans à 256 couleurs, était nécessaire ; le nombre 216 a été choisi en partie parce que
les systèmes d'exploitation réservaient fréquemment seize à vingt couleurs pour leur propre usage ; et il fut choisi également car il
permettait exactement six niveaux de rouge, de vert et de bleu (6 × 6 × 6 = 216).

La liste des couleurs est souvent présentée comme si elle avait des propriétés spéciales qui les rendraient immunisées au tramage. En
fait, sur les moniteurs à 256 couleurs les applications peuvent fixer une palette de n'importe quelle sélection de couleurs de leur
choix, tramant le reste. Ces couleurs ont été choisies spécialement parce qu'elles correspondaient aux palettes choisies par les
principales applications de navigateur de l'époque. Heureusement, les palettes utilisées par les différents navigateurs populaires
n'étaient pas foncièrement différentes.

Les couleurs garanties sur le web avaient un défaut, sur les systèmes tel que X11 où la palette est partagée entre les applications, de
plus petits cubes de couleurs RVB (5×5×5 ou 4×4×4) sont souvent alloués par les navigateurs — ainsi, les couleurs garanties sur le
web trament sur de tels systèmes. De meilleurs résultats étaient obtenus en fournissant une image avec une plus large gamme de
couleurs et permettant au navigateur de quantifier l'espace de couleur si nécessaire, plutôt que de subir la perte de qualité d'une
double quantification.

e
Dans les premières années du XXI siècle, conduits par les besoins du jeu vidéo et de la photographie numérique, les ordinateurs
personnels ont au moins des couleurs en 16 bits et généralement 24 bits (couleurs vraies). Même les appareils mobiles ont au moins
les couleurs en 16 bits, du fait des options caméras sur les téléphones mobiles. L'utilisation des couleurs garanties web est tombé en
désuétude, mais persiste dans le folklore.

Le système de la palette garantie pour le web persiste comme étant la palette avec le plus grand nombre de couleurs distinctes, où
chaque couleur peut être distinguée séparément par l’œil humain.

Les couleurs garanties pour le web n'ont pas de noms, mais chacune peut être spécifiée par un triplet RGB.

Tableau de couleur
Le tableau suivant montre toutes les couleurs « garanties pour le web », mais aussi en souligné les couleurs vraiment garanties.
L'absence de correction gamma implique que les six intensités souhaitées 0 %, 20 %, 40 %, 60 %, 80 %, et 100 % sont affichés à
0 %, 2 %, 10 %, 28 %, 57 %, et 100 % dans un standard 2,5 gamma CRT ou LCD, faisant la plupart des couleurs très sombres. Les
intensités dans le bas de la gamme, particulièrement entre 0 et 3, sont quasiment indiscernables les unes des autres sur un écran non
conforme ou non réglé sRGB.

Les couleurs sont ici représentées avec lanotation courte (trois chiffres hexadécimaux).
Couleurs garanties sur le Web
*000* 300 600 900 C00 *F00*
*003* 303 603 903 C03 *F03*
006 306 606 906 C06 F06
009 309 609 909 C09 F09
00C 30C 60C 90C C0C F0C
*00F* 30F 60F 90F C0F *F0F*
030 330 630 930 C30 F30
033 333 633 933 C33 F33
036 336 636 936 C36 F36
039 339 639 939 C39 F39
03C 33C 63C 93C C3C F3C
03F 33F 63F 93F C3F F3F
060 360 660 960 C60 F60
063 363 663 963 C63 F63
066 366 666 966 C66 F66
069 369 669 969 C69 F69
06C 36C 66C 96C C6C F6C
06F 36F 66F 96F C6F F6F
090 390 690 990 C90 F90
093 393 693 993 C93 F93
096 396 696 996 C96 F96
099 399 699 999 C99 F99
09C 39C 69C 99C C9C F9C
09F 39F 69F 99F C9F F9F
0C0 3C0 6C0 9C0 CC0 FC0
0C3 3C3 6C3 9C3 CC3 FC3
0C6 3C6 6C6 9C6 CC6 FC6
0C9 3C9 6C9 9C9 CC9 FC9
0CC 3CC 6CC 9CC CCC FCC
0CF 3CF 6CF 9CF CCF FCF
*0F0* 3F0 *6F0* 9F0 CF0 *FF0*
0F3 *3F3* *6F3* 9F3 CF3 *FF3*
*0F6* *3F6* 6F6 9F6 *CF6* *FF6*
0F9 3F9 6F9 9F9 CF9 FF9
*0FC* *3FC* 6FC 9FC CFC FFC
*0FF* *3FF* *6FF* 9FF CFF *FFF*

Couleurs vraiment garanties pour le web


Les concepteurs sont souvent encouragés à rester fidèles aux 216 couleurs garanties pour le web dans l'élaboration de leur site web ;
les moniteurs de couleur 8 bits étaient plus courants quand la palette de 216 couleurs a été établie qu'ils ne le sont aujourd'hui. David
Lehn et Hadley Stern ont découvert que seules 22 des 216 couleurs de la palette sont fidèlement affichées sans remappage incohérent
sur des moniteurs 16 bits. Ils appelèrent ces 22 couleurs la palette vraiment garantie ("really safe" palette) ; elle est composée
principalement de tons de vert et de jaune, comme on peut le voir dans le tableau ci-dessus, où les couleurs vraiment sécurisées sont
soulignées.

Couleurs utilisées dans les CSS


Le langage des feuilles de style en cascade(Cascading Style Sheets, CSS)définit le même nombre de couleurs et les mêmes noms des
couleurs que dans les spécifications du HTML 4, c'est-à-dire les 16 couleurs énumérées précédemment.

De plus, CSS 2.1 ajoute le nom de couleur 'orange' à la liste :

Color Hexadecimal
orange #FFA500

CSS 2, SVG et CSS 2.1 permettent aux auteurs de pages web d'utiliser les dites « couleurs système », qui sont le nom des couleurs
10
dont la valeur provient du système d'exploitation . Cela rend possible aux auteurs de documents web de styliser leur contenu en
ligne avec les couleurs définies dans l'environnement de travail de l'utilisateur. Depuis début 2004, il se trouve que le module de
11
couleur CSS 3 abandonnera une fois encore ces valeurs, les rendantobsolètes, mais cela pourrait changer .

Les spécifications CSS3 ont introduit également les valeurs de espace


l' de couleur TSLaux feuilles de styles :

/* modèle RVB */
p { color: #F00 } /* #rgb */
p { color: #FF0000 } /* #rrggbb */
p { color: rgb(255,0,0) } /* intervalle entier 0 - 255 */
p { color: rgb(100%, 0%, 0%) } /* intervalle à virgule flottante 0,0 % - 100,0 % */

/* RVB avec canal alpha, ajouté à partir de CSS3 */


p { color: rgba(255,0,0,0.5) } /* intervalle à virgule flottante 0 - 1, 0,5 étant semi-transparent */

/* modèle TSL, ajouté à partir de CSS3 */


p { color: hsl(0, 100%, 50%) } /* rouge */
p { color: hsl(120, 100%, 50%) } /* vert */
p { color: hsl(120, 100%, 25%) } /* vert clair */
p { color: hsl(120, 100%, 75%) } /* vert foncé */
p { color: hsl(120, 50%, 50%) } /* vert pastel */

/* TSL avec canal alpha */


p { color: hsla(120, 100%, 50%, 1) } /* vert */
p { color: hsla(120, 100%, 50%, 0.5) } /* vert semi-transparent */
p { color: hsla(120, 100%, 50%, 0.1) } /* vert très transparent */

Accessibilité
L'utilisation de la couleur dans les pages Web est soumise à deux règles d'accessibilité selon les normes d'accessibilité WCAG
12
définies par le W3C :

Aucune information ne doit être véhiculée uniquement par la couleur . En effet, celle-ci ne sera pas perceptible
pour certains utilisateurs, comme les personnes aveugles naviguant à l'aide d'un lecteur d'écran. Elle sera
également difficilement compréhensible pourd'autres utilisateurs ayant un handicap visuel, notamment les
daltoniens. La couleur doit donc être accompagnée par un autre moyen de véhiculer l'information, qu'il soit
graphique, textuel ou structurel. Cette règle relève du niveau de priorité 1 des WCAG, c'est-à-dire du niveau
minimal d'accessibilité d'un site.
Lorsque la couleur est utilisée de cette manière, un niveau decontraste suffisant avec l'arrière-plan doit être
assuré. Cette règle s'applique aux images comme aux contenus textuels. Elle relève, selon le cas, du niveau
intermédiaire ou optimal d'accessibilité d'un site. La mesure de ce niveau de contraste et les seuils admissibles
13
varient légèrement selon les méthodes d'application des WCAG .

Voir aussi

Bibliographie

Articles connexes
Codage informatique des couleurs
Teinte saturation lumière

Notes et références
a. Le croisillon n'est pas un dièse.
b. Pour convertir une valeur décimale en une valeur hexadécimale,

1. ramener l'étendue des valeurs à [0,255]. Si elles sont comprises entre 0 et 1, multipliez la valeur par 255
avant la conversion ;
2. divisez ce nombre par 16 avec reste ;
3. le quotient est le premier chiffre du code, le reste est le second. La numérationhexadécimale représente
les nombres de 0 à 9 comme la notation décimale ; ceux compris entre 10 et 15 se notent avec les lettres A,
B, C, D, E, F (majuscules ou minuscules).

exemple :
201 = (12×16)+9, donc le premier chiffre est l'hexadécimal qui représente la valeur 12, C, et le second
est 9. Le code hexadécimal estC9.

1. Les couleurs en CSS (en)[1] (http://www.w3.org/TR/CSS2/syndata.html#color-units), traduction non officielle : [2] (htt
p://www.yoyodesign.org/doc/w3c/css2/syndata.html#color-units)
2. IE8 interprète mal le bgcolor avec trois chiffres hexadécimaux (http://www.plus2clics.com/?p=528)
3. HTML 4.01 Specification section 6.5 "Colors"(http://www.w3.org/TR/REC-html40/types.html#h-6.5)
4. Le guide du code HTML,« Les couleurs standardisées ou palette de couleurs »(http://www.guide-code-html.com/cou
leurs-standards.php).
5. HTML 3.2 Specification "The BODY element"(http://www.w3.org/TR/REC-html32#body)
6. Public discussion on SVG mailing listRe: color names in SVG-1.0 conflict with /usr/lib/X11/rgb.txt(http://lists.w3.org/
Archives/Public/www-svg/2002Apr/0052.html)
7. W3C TR CSS3 Color Module, SVG color keywords(http://www.w3.org/TR/css3-color/#svg-color)
8. W3C TR SVG 1.0, recognized color keyword names(http://www.w3.org/TR/SVG/types.html#ColorKeywords)
9. Le guide des couleurs web(https://www.crazy-colors.net/fr/)
10. Voir system-colors (http://www.w3.org/TR/CSS21/ui.html#system-colors)
11. css2-system (http://www.w3.org/TR/css3-color/#css2-system)
12. (en) Web Content Accessibility Guidelines 1.0, Don't rely on color alone (http://www.w3.org/TR/WCAG10/#gl-color)
13. (en) Techniques For Accessibility Evaluation AndRepair Tools (W3C) (http://www.w3.org/TR/AERT#color-contrast)
et Techniques for WCAG 2.0 (W3C)(http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20071211/G18.html)

Ce document provient de «https://fr.wikipedia.org/w/index.php?title=Couleur_du_Web&oldid=154617522 ».

La dernière modification de cette page a été faite le 8 décembre 2018 à 16:02.


Droit d'auteur : les textes sont disponibles souslicence Creative Commons attribution, partage dans les mêmes
conditions ; d’autres conditions peuvent s’appliquer . Voyez les conditions d’utilisation pour plus de détails, ainsi que les
crédits graphiques. En cas de réutilisation des textes de cette page, voyezcomment citer les auteurs et mentionner la
licence.
Wikipedia® est une marque déposée de laWikimedia Foundation, Inc., organisation de bienfaisance régie par le
paragraphe 501(c)(3) du code fiscal des États-Unis.

Vous aimerez peut-être aussi