Come un pittore sceglie con cura i colori della sua tavolozza, così il web designer deve, nei limiti del possibile,scegliere la "palette" di colori ideale per realizzare le sue creazioni artistiche. (Una palette di colori non è altro che un set, un insieme di colori.)
I colori in HTML si possono esprimere in due modi:
- in formato RGB (Red Green Blue);
- indicandone il nome (solo con Netscape e Internet Explorer).
Il primo è sicuramente il più flessibile ed è anche il metodo utilizzato da gran parte degli editor per le elaborazioni delle immagini.
Si basa sulla combinazione dei tre colori fondamentali Rosso, Verde e Blu per ottenere un qualsiasi colore nella gamma di quelli disponibili. A ciascuno di questi tre colori è possiblie assegnare un valore esadecimale compreso tra "00" e "FF" (corrispondenti a 0 e 255) combinandoli in modo da ottenere la tonalità desiderata.
Si ottengono in questo modo dei codici di sei cifre che vanno sempre preceduti dal simbolo # e compresi tra apici.
Si riportano di seguito i codici esadecimali e i nomi dei 126 colori fondamentali riconosciuti da Netscape Navigator 2.0 (per poterli visualizzare la scheda grafica deve supportare almeno 256 colori).
Oltre a questi colori fondamentali è possibile ottenere tantissime altre combinazioni.
Ad esempio per le diverse tonalità del blu si possono usare:
ma tutte le combinazioni possibili sono supportate solo da schede grafiche con 16M di colori.
I colori in HTML si possono esprimere in due modi:
- in formato RGB (Red Green Blue);
- indicandone il nome (solo con Netscape e Internet Explorer).
Il primo è sicuramente il più flessibile ed è anche il metodo utilizzato da gran parte degli editor per le elaborazioni delle immagini.
Si basa sulla combinazione dei tre colori fondamentali Rosso, Verde e Blu per ottenere un qualsiasi colore nella gamma di quelli disponibili. A ciascuno di questi tre colori è possiblie assegnare un valore esadecimale compreso tra "00" e "FF" (corrispondenti a 0 e 255) combinandoli in modo da ottenere la tonalità desiderata.
Si ottengono in questo modo dei codici di sei cifre che vanno sempre preceduti dal simbolo # e compresi tra apici.
La seconda possibilità, non compatibile per tutti i browser, permette di indicare direttamente il colore desiderato (naturalmente in inglese).
Si riportano di seguito i codici esadecimali e i nomi dei 126 colori fondamentali riconosciuti da Netscape Navigator 2.0 (per poterli visualizzare la scheda grafica deve supportare almeno 256 colori).
"#A0CE00" | "ALICEBLUE" | "#FAEBD7" | "ANTIQUEWHITE" | ||
"#00FFFF" | "AQUA" | "#7FFFD4" | "AQUAMARINE" | ||
"#F0FFFF" | "AZURE" | "#F5F5DC" | "BEIGE" | ||
"#FFE4C4" | "BISQUE" | "#000000" | "BLACK" | ||
"#FFEBCD" | "BLANCHEDALMOND" | "#0000FF" | "BLUE" | ||
"#8A2BE2" | "BLUEVIOLET" | "#A52A2A" | "BROWN" | ||
"#DEB887" | "BURLYWOOD" | "#5F9EA0" | "CADETBLUE" | ||
"#7FFF00" | "CHARTREUSE" | "#D2691E" | "CHOCOLATE" | ||
"#FF7F50" | "CORAL" | "#6495ED" | "CORNFLOWERBLUE" | ||
"#FFF8DC" | "CORNSILK" | "#DC143C" | "CRIMSON" | ||
"#00FFFF" | "CYAN" | "#00008B" | "DARKBLUE" | ||
"#483D8B" | "DARKSLATEBLUE" | "##008B8B" | "DARKCYAN" | ||
"#B8860B" | "DARKGOLDENROD" | "#A9A9A9" | "DARKGRAY" | ||
"#FF1493" | "DEEPPINK" | "#00BFFF" | "DEEPSKYBLUE" | ||
"##696969" | "DIMGRAY" | "#1E90FF" | "DODGERBLUE" | ||
"#822222" | "FIREBRICK" | "#FFFAF0" | "FLORALWHITE" | ||
"#228B22" | "FORESTGREEN" | "#FF00FF" | "FUCHSIA" | ||
"#DCDCDC" | "GAINSBORO" | "#F8F8FF" | "GHOSTWHITE" | ||
"#FFD700" | "GOLD" | "#DAA520" | "GOLDENROD" | ||
"#808080" | "GRAY" | "#008800" | "GREEN" | ||
"#ADFF2F" | "GREENYELLOW" | "#F0FFF0" | "HONEYDEW" | ||
"#FF69B4" | "HOTPINK" | "#CD5C5C" | "INDIANRED" | ||
"#4B0082" | "INDIGO" | "#FFFFF0" | "IVORY" | ||
"#F0E68C" | "KHAKY" | "#E6E6FA" | "LAVENDER" | ||
"#FFF0F5" | "LAVENDERBLUSH" | "#FFFACD" | "LEMONCHIFFON" | ||
"#ADD8E6" | "LIGHTBLUE" | "#F08080" | "LIGHTCORAL" | ||
"#E0FFFF" | "LIGHTCYAN" | "#FAFAD2" | "LIGHTGOLDENRODYELLOW" | ||
"#90EE90" | "LIGHTGREEN" | "#D3D3D3" | "LIGHTGRAY" | ||
"#FFB6C1" | "LIGHTPINK" | "#FFA07A" | "LIGHTSALMON" | ||
"#20B2AA" | "LIGHTSEAGREEN" | "#87CEFA" | "LIGHTSKYBLUE" | ||
"#778899" | "LIGHTSLATEGRAY" | "#B0C4DE" | "LIGHTSTEELBLUE" | ||
"#FFFFE0" | "LIGHTYELLOW" | "#00FF00" | "LIME" | ||
"#32CD32" | "LIMEGREEN" | "#FAF0E6" | "LINEN" | ||
"#FF00FF" | "MAGENTA" | "#800000" | "MAROON" | ||
"#66CDAA" | "MEDIUMAQUAMARINE" | "#0000CD" | "MEDIUMBLUE" | ||
"#BA55D3" | "MEDIUMMORCHID" | "#9370DB" | "MEDIUMPURPLE" | ||
"#3CB371" | "MEDIUMSEAGREEN" | "#7B68EE" | "MEDIUMSLATEBLUE" | ||
"#00FA9A" | "MEDIUMSPRINGGREEN" | "#48D1CC" | "MEDIUMTORQUOISE" | ||
"#C71585" | "MEDIUMVIOLETRED" | "#191970" | "MIDNIGHTBLUE" | ||
"#F5FFFA" | "MINTCREAM" | "#FFE4E1" | "MISTYROSE" | ||
"#FFDEAD" | "NAVAJOWHITE" | "#000080" | "NAVY" | ||
"#FDF5E6" | "OLDLACE" | "#808000" | "OLIVE" | ||
"#6B8E23" | "OLIVEDRAB" | "#FFA500" | "ORANGE" | ||
"#FF4500" | "ORANGERED" | "#DA70D6" | "ORCHID" | ||
"#EEE8AA" | "PALEGOLDENROD" | "#98FB98" | "PALEGREEN" | ||
"#AFEEEE" | "PALETURQUOISE" | "#DB7093" | "PALEVIOLETRED" | ||
"#FFEFD5" | "PAPAYAWHIP" | "#FFDAB9" | "PEACHPUFF" | ||
"#CD853F" | "PERU" | "#FFC0CB" | "PINK" | ||
"#DDA0DD" | "PLUM" | "#B0E0E6" | "POWDERBLUE" | ||
"#800080" | "PURPLE" | "#FF0000" | "RED" | ||
"#BC8F8F" | "ROSYBROWN" | "#4169E1" | "ROYALBLUE" | ||
"#8B4513" | "SADDLEBROWN" | "#FA8072" | "SALMON" | ||
"#F4A460" | "SANDYBROWN" | "#2E8B57" | "SEAGREEN" | ||
"#FFF5EE" | "SEASHELL" | "#A0522D" | "SIENNA" | ||
"#C0C0C0" | "SILVER" | "#87CEEB" | "SKYBLUE" | ||
"#6A5ACD" | "SLATEBLUE" | "#708090" | "SLATEGRAY" | ||
"#FFFAFA" | "SNOW" | "#00FF7F" | "SPRINGGREEN" | ||
"#468284" | "STEELBLUE" | "#D2B48C" | "TAN" | ||
"#008080" | "TEAL" | "#D8BFD8" | "THISTLE" | ||
"#FF6347" | "TOMATO" | "#40E0D0" | "TURQUOISE" | ||
"#EE82EE" | "VIOLET" | "#F5DEB3" | "WHEAT" | ||
"#FFFFFF" | "WHITE" | "#F5F5F5" | "WHITESMOKE" | ||
"#FFFF00" | "YELLOW" | "#9ACD32" | "YELLOWGREEN" |
Oltre a questi colori fondamentali è possibile ottenere tantissime altre combinazioni.
Ad esempio per le diverse tonalità del blu si possono usare:
"#0000CC" | |
"#000088" | |
"#000055" | |
"#000022" |
Se ti è piaciuto l'articolo , iscriviti al feed cliccando sull'immagine sottostante per tenerti sempre aggiornato sui nuovi contenuti del blog:
Nessun commento:
Posta un commento