Come possiamo fare apparire sui dispositivi di output (es. televisori, monitor, display) i colori che incontriamo nella vita di ogni giorno? Come possiamo scrivere nel linguaggio del device elettronico quale punto dell'immagine sarà rosso, bianco, nero o di qualsiasi altro colore? Se dovessimo dare una risposta breve a tutte queste domande, essa sarebbe la sintesi del colore e l'uso dei modelli di colore. I modelli descrivono diversi modi di sintesi per riprodurre i colori. In altre parole i modelli permettono di codificare ogni colore, in modo che la scelta possa essere effettuata immettendo il relativo codice.
I modelli di colore più famosi sono RGB, CMYK, HSL, HSV (ovvero HSB), XYZ, Yxy. Esistono anche altri modelli. Il nostro scopo è fornire informazione sui codici di colore per il web, per questo siamo orientati verso i codici hex e i codici del modello RGB. Scegliete la sezione del sito che v’interessa di più.
E' possibile stabilire il colore degli elementi delle pagine web in quattro modi.
.text { color: #FF0000; }
.bg { background: #A52A2A; }
.text { color: red; }
.bg { background: brown; }
.text { color: rgb(255,0,0,0.7); }
.bg { background: rgb(165,42,42); }
.text { color: hsla(120, 100%, 50%, 0.5); }
.bg { background: hsl(0, 100%, 50%); }
Il nome del modello è un'abbreviazione delle parole inglesi Red + Green + Blue. RGB è un modello di colore composto da tre canali: rosso + verde + blu. Ognuno dei tre canali è composto da un intervallo numerico da 0 a 255. Così ogni colore è rappresentato da tre coppie d’intervalli. Il modello definisce ogni colore come un mix di tre colori in proporzioni diversi.
Esempi di colori definiti secondo il modello RGB: 255.0.0 — rosso, 255.255.0 — giallo, 165.42.42 — marrone.
Un’altra cosa interessante da capire è: quanti colori ci sono alla fine? Dato che ogni intervallo include 256 combinazioni e ci sono tre intervalli, allora il numero totale dei colori è 2563 = 16 777 216. Ogni colore del modello è definito da un codice unico.
Questo modello di colore è utilizzato molto nei dispositivi.
Avrà una dimensione completa di 4096×4096 pixel.