Strumento determinazione colore

Consente di ottenere il codice RGB di un colore basandosi su prove visive, ed anche di valutare l'abbinamento di due colori da usare come primo piano e sfondo

• Spiegazioni teoriche sulla notazione numerica dei colori e sui tipi di codifica
• Come usare questo strumento
• Tabella dei colori definiti "sicuri" (web safe)
• Tabella dei colori con nome HTML
• Determinazione di un colore, impostazione di un colore personale come riferimento per il test
• Variazioni cromatiche del colore scelto
• Riquadro di test per colori personali
• Tabella per verificare il colore scelto usato come primo piano
• Tabella per verificare il colore scelto usato come sfondo
• Note di sviluppo e crediti

- Ovunque nella pagina premendo il tasto "" (anche indicato con "Home" o "Inizio") si torna all'inizio, su questo indice d'argomenti.

La notazione numerica dei colori

Esistono diversi modi per codificare i colori tramite un valore numerico che li contraddistingua in maniera univoca, i due più diffusi sono denominati RGB e CMY o CMYK.

Per ogni metodo è stato individuato un insieme di colori definiti di base, o primari per quel metodo, e tutti gli altri colori possibili sono definiti basandosi sui colori base.

In pratica viene stabilito un intervallo numerico con cui esprimere l’intensità o quantità che serve per ogni colore base al fine d’ottenere il colore voluto; ossia ogni colore viene individuato in maniera univoca da un gruppo di numeri, tanti numeri quanti sono i colori primari per quel metodo.

Essendo questi metodi usati in informatica, per la rappresentazione dei colori, gli intervalli numerici si basano su valori che derivano dall’aritmetica binaria, o esadecimale per comodità. Precisamente l’intensità di ogni colore base viene espressa con un numero variabile da 0 a 255, che in esadecimale rappresenta l’intervallo di tutti i numeri rappresentabili con due cifre.

Nota: le cifre esadecimali (base sedici) sono 0-1-2-3-4-5-6-7-8-9-A-B-C-D-E-F. Le combinazioni possibili con 2 di queste cifre sono 256 (16x16=256; numeri decimali da 0 a 255), come per analogia quelle possibili con 2 cifre nel sistema decimale sono 100 (10x10=100; numeri da 0 a 99). (Es.: 255 in decimale = FF in esadecimale; 100 in decimale = 64 in esadecimale; 200 in decimale = C8 in esadecimale.)

Quindi il codice numerico univoco di un colore, espresso secondo un determinato metodo, sarà indicato normalmente con un numero esadecimale composto da sequenze di due cifre quanti sono i colori base, oppure da gruppi di numeri decimali compresi nell'intervallo 0-255 (es.: F1 A3 77 o 241 163 119).

Teoria sul colore

La codifica RGB considera come colori base il rosso, il verde ed il blu (RGB=Red/Green/Blue).

Ogni colore rappresentabile è definito da una sequenza di 3 numeri, da 0 a 255, dove ogni numero rappresenta l'intensità del colore base rosso/verde/blu. La notazione informatica per la rappresentazione di un colore in RBG è con 6 cifre esadecimali.

Le combinazioni ottenibili con questa notazione sono: 256 x 256 x 256 = 16.777.216, che è il numero di colori rappresentabili nella codifica RGB, ossia, usando un termine tecnico, rappresenta lo "spazio colore RGB".

La codifica RGB è denominata sintesi additiva, in quanto definisce i colori basandosi sull'intensità del rosso, verde e blu (somma di onde luminose di diversa frequenza che raggiungono il nostro occhio) e corrisponde al modo in cui gli schermi dei computer ed i televisori rappresentano i colori, oltre ad essere usata nei sensori delle macchine fotografiche digitali e degli scanner. Con questa modalità si ottiene il nero dall'assenza dei tre componenti (terna 0,0,0 [esadec.000000]), mentre il bianco è l'unione delle loro intensità massime (terna 255,255,255 [esadec.FFFFFF]).

Il motivo che ha portato alla scelta dei colori primari è correlato alla fisiologia dell'occhio umano. I tre tipi normali di cellule sensibili alla luce nell'occhio umano (le cellule cono) rispondono più alla luce gialla (lunghezza d'onda lunga), verde (media) e viola (corta), producendo la sensazione di colore.

L'occhio umano distingue circa 10 milioni di colori, quindi apparentemente i 16 milioni di possibilità teoriche di colori differenti della codifica RGB sono più del necessario, ma invece l'uso dei tre colori primari non è sufficiente a riprodurre tutti i colori, ma solo quelli entro il triangolo dei colori definito dalla cromaticità dei primari, inoltre il valore di 16 milioni è teorico dato che dipende fortemente dall'hardware di visualizzazione.

La codifica CMY (Cyan/Magenta/Yellow, in italiano ciano, magenta e giallo) si usa per la stampa ed è la sintesi sottrattiva. Ossia è usata per definire i colori non tramite uno strumento che emette radiazioni luminose ma tramite un oggetto inerte stampato che riflette selettivamente le onde luminose da cui è colpito; quindi la sensazione del colore per l’occhio umano è provocata dalle onde riflesse e per ottenere un determinato colore bisogna trasferire sulla carta un pigmento che assorba le onde che non concorrono alla composizione (RGB) del colore che si vuole vedere.

La sintesi sottrativa consiste nel decomporre un colore nel valore dei componenti primari ed ogni colore è definito dalla quantità di pigmento del colore base che serve per ottenere il pigmento risultante che, colpito da luce bianca emessa da una sorgente luminosa, rifletta selettivamente, ovvero assorba selettivamente, le radiazioni luminose che generano il colore voluto. Ad esempio, un pigmento giallo assorbe il blu e riflette rosso e verde, che insieme (in RGB, sintesi additiva) forniscono la visione del giallo.

Nella codifica CMY l'assenza dei tre componenti base dà il bianco (il colore del foglio), mentre il loro apporto, tutti in quantità massima, dà il nero. Tuttavia nella pratica, il nero ottenuto dai tre colori ciano, magenta e giallo è solo parzialmente nero ed oneroso da ottenere (è il bistro, colore simile a una tonalità di marrone molto scura), quindi le stamperie aggiungono una componente d'inchiostro nero detta nero puro. Si parla allora di quadricromia, o modello CMYK (Cyan/Magenta/Yellow/blacK pur), la scelta della lettera K per il nero, anzichè la lettera B iniziale nella traduzione inglese, è stata fatta per evitare confusioni con l'iniziale del colore Blue.

I colori base della codifica CMY rappresentati in RGB sono:

•  ciano  = rosso-assente/verde-massimo/blu-massimo (terna 0,255,255 [esadec.00FFFF]), complementare del rosso;
•  magenta  = rosso-massimo/verde-assente/blu-massimo (terna 255,0,255 [esadec.FF00FF]), complementare del verde;
•  giallo  = rosso-massimo/verde-massimo/blu-assente (terna 255,255,0 [esadec.FFFF00]), complementare del blu.

Viceversa:

•  rosso  = ciano,magenta,giallo (terna 0,99,100 [esadec.006364]);
•  verde  = ciano,magenta,giallo (terna 63,0,100 [esadec.3F0064]);
•  blu  = ciano,magenta,giallo (terna 88,77,0 [esadec.584D00]).

Le due figure mostrano tre cerchi con i colori primari delle codifiche, sovrapposti in modo da vedere il colore risultante nelle zone d'intersezione.

Come si può notare, nella sintesi additiva l'unione dei 3 colori produce il bianco, mentre in quella sottrattiva s'ottiene il nero.

Legenda:
R=rosso - G=verde - B=blu
C=ciano - M=magenta - Y=giallo

Relazione tra i due metodi di codifica dei colori. Quando un'immagine con i colori codificati in RGB viene stampata si noterà che i colori appaiono meno luminosi, intensi, in quanto è impossibile per il processo di stampa riprodurre esattamente i colori come si vedono sul monitor. Per stampare un'immagine la codifica dei colori deve essere cambiata in CMYK, questa variazione può essere attuata dal software di stampa o, per avere un migliore controllo sul risultato che si otterrà, può essere fatta anche mentre si continua a vederla a video. Anche in questo caso però non ci si può aspettare che la stampa corrisponda esattamente a quanto si vede, perchè la rappresentazione dei colori dipende dal tipo di monitor che si usa (CRT o LCD), dalla sua regolazione (luminosità, contrasto e temperatura colore) e dalla sua qualità e poi dalla stampante, quindi ci si può avvicinare alla corrispondenza solo calibrando reciprocamente il monitor e la stampante usati. Un'immagine convertita apparirà a video un poco più scura, ed inoltre in RGB si possono vedere colori che non sono ottenibili in CMYK e se presenti vengono approssimati, comunque dopo la conversione si dovrebbe vedere un'immagine più vicina alla stampa e sulla quale apportare, con maggiore precisione, eventuali correzioni cromatiche finalizzate ad ottenere il risultato di stampa voluto.

Conoscendo il codice RGB di un colore si può ricavare il suo valore approssimativo CMYK, per la stampa, tramite le seguenti equazioni:

     Black = minimo( 1 - Red, 1 - Green, 1 - Blue )

     Cyan = ( 1 - Red - Black ) / ( 1 - Black )

     Magenta = ( 1 - Green - Black ) / ( 1 - Black )

     Yellow = ( 1 - Blue - Black ) / ( 1 - Black )

Da notare che in tali equazioni il valore dei componenti primari deve essere normalizzato, con una proporzione, ottenendo un valore compreso tra zero ed uno.

Il valore che si ricava è comunque approssimativo in quanto ci sono molteplici fattori fisici da considerare, legati alla calibrazione colore del monitor, della stampante e al tipo d'inchiostro e di carta. Oltre al fatto che i due insiemi di colori non hanno una perfetta corrispondenza.

Per convertire per la stampa (CMYK) immagini in RGB, conviene usare i programmi professionali di grafica che supportano questa funzione (es.: Adobe Illustrator, Adobe InDesign, Adobe Photoshop, CorelDraw, Microsoft Publisher, QuarkXpress, ...).

Come usare questo strumento

Lo scopo è individuare un colore che soddisfi la propria esigenza, o in termini d'appartenenza ad un determinato insieme, o di tonalità, o d'armonia visiva in relazione ad un altro colore già deciso. Una volta individuato il colore voluto si avrà a disposizione il suo codice numerico (esadecimale e decimale), per usarlo ove richiesto.

Lo strumento inizialmente ha già un colore di riferimento impostato, visibile nel riquadro di determinazione del colore, questo colore viene usato come base di cui mostrare le possibili variazioni ed abbinamenti. Per prima cosa bisogna scegliere un'altro colore di riferimento, nel caso quello d'avvio non sia di proprio gusto. Per fare questo sono disponibili diversi metodi: il primo è scegliendo un colore dalle due tabelle seguenti, che rappresentano due insiemi di colori usati per il Web; oppure si può fornire direttamente il codice del colore nel riquadro di determinazione del colore, posto dietro le due tabelle dei colori Web.

Quando è definito un colore di riferimento, sono visualizzate e selezionabili, dopo il riquadro di determinazione del colore, le sue variazioni cromatiche più chiare e più scure ed anche quelle ottenibili variando solo alcuni componenti base della composizione di quel colore, oppure è possibile schiarirlo o scurirlo a piacere. L'azione cromatica sul colore di riferimento lo reimposta al nuovo valore scelto.

Nelle due tabelle in fondo alla pagina, il colore di riferimento impostato, è usato come primo piano e come sfondo in abbinamento a tutti i colori delle due tabelle dei colori Web, per valutare la visibilità delle coppie di colori "primo piano/sfondo".

Infine, l'ultima funzionalità di questo strumento è di consentire di testare visivamente l'effetto dell'abbinamento "primo piano/sfondo" di due colori non compresi nelle due tabelle dei colori Web. Questa verifica è possibile usando il riquadro di test nel modo seguente: quando si è individuato il primo colore personalizzato, impostato come colore di riferimento, bisogna fissarlo nel riquadro di test, scegliendo se lo si vorrà vedere come sfondo o primo piano, a questo punto, essendoci un solo colore per ora definito, si vedrà solo un riquadro colorato (scritta e sfondo sono del medesimo colore), però procedendo ora con la scelta del secondo colore personalizzato si vedrà questo colore comparire nel riquadro di test, come scritta o come sfondo a seconda di dove era stato fissato il primo colore. In ogni momento è possibile annullare l'impostazione scelta fissando l'attuale colore di riferimento come sfondo o primo piano per un nuovo test.

Considerando che ormai, in genere, la configurazione dei PC consente di visualizzare la gamma di colori di 65 mila se non 16 milioni, non dovrebbero esserci problemi di visualizzazione neppure usando dei colori personalizzati nella gamma dei 16 milioni.