CSS - Colori
CSS utilizza valori di colore per specificare un colore. Tipicamente, questi sono usati per impostare un colore per il primo piano di un elemento (cioè, il suo testo) oppure per lo sfondo dell'elemento. Possono anche essere usati per influenzare il colore dei bordi e altri effetti decorativi.
È possibile specificare i valori del colore in vari formati. La tabella seguente elenca tutti i formati possibili:
Formato | Sintassi | Esempio |
---|---|---|
Codice esadecimale | #RRGGBB | p {color: # FF0000;} |
Codice esadecimale breve | #RGB | p {color: # 6A7;} |
RGB% | rgb (rrr%, ggg%, bbb%) | p {colore: rgb (50%, 50%, 50%);} |
RGB assoluto | rgb (rrr, ggg, bbb) | p {color: rgb (0,0,255);} |
parola chiave | acqua, nero, ecc. | p {color: teal;} |
Questi formati sono spiegati più dettagliatamente nelle seguenti sezioni:
Colori CSS - Codici esadecimali
Un esadecimale è una rappresentazione a 6 cifre di un colore. Le prime due cifre (RR) rappresentano un valore rosso, le due successive sono un valore verde (GG) e le ultime sono il valore blu (BB).
Un valore esadecimale può essere preso da qualsiasi software di grafica come Adobe Photoshop, Jasc Paintshop Pro o anche utilizzando Advanced Paint Brush.
Ogni codice esadecimale sarà preceduto da un cancelletto o un cancelletto "#". Di seguito sono riportati gli esempi per utilizzare la notazione esadecimale.
Colore | Colore HEX |
---|---|
# 000000 | |
# FF0000 | |
# 00FF00 | |
# 0000FF | |
# FFFF00 | |
# 00FFFF | |
# FF00FF | |
# C0C0C0 | |
#FFFFFF |
Colori CSS - Codici esadecimali brevi
Questa è una forma più breve della notazione a sei cifre. In questo formato, ogni cifra viene replicata per arrivare a un valore di sei cifre equivalente. Ad esempio: # 6A7 diventa # 66AA77.
Un valore esadecimale può essere preso da qualsiasi software di grafica come Adobe Photoshop, Jasc Paintshop Pro o anche utilizzando Advanced Paint Brush.
Ogni codice esadecimale sarà preceduto da un cancelletto o un cancelletto "#". Di seguito sono riportati gli esempi per utilizzare la notazione esadecimale.
Colore | Colore HEX |
---|---|
# 000 | |
# F00 | |
# 0F0 | |
# 0FF | |
# FF0 | |
# 0FF | |
# F0F | |
#F F F |
Colori CSS - Valori RGB
Questo valore di colore viene specificato utilizzando il rgb( )proprietà. Questa proprietà accetta tre valori, uno per rosso, verde e blu. Il valore può essere un numero intero compreso tra 0 e 255 o una percentuale.
NOTE - Tutti i browser non supportano la proprietà rgb () del colore quindi si consiglia di non utilizzarla.
Di seguito è riportato l'esempio per mostrare pochi colori utilizzando valori RGB.
Colore | Colore RGB |
---|---|
rgb (0,0,0) | |
rgb (255,0,0) | |
rgb (0,255,0) | |
rgb (0,0,255) | |
rgb (255,255,0) | |
rgb (0,255,255) | |
rgb (255,0,255) | |
rgb (192,192,192) | |
rgb (255,255,255) |
Codici colore degli edifici
Puoi creare milioni di codici colore utilizzando il nostro Color Code Builder. Controlla il nostroHTML Color Code Builder. Per utilizzare questo strumento, è necessario un browser abilitato per Java.
Colori sicuri per il browser
Ecco l'elenco dei 216 colori che dovrebbero essere i colori più sicuri e indipendenti dal computer. Questi colori variano dal codice hexa 000000 a FFFFFF. Questi colori sono sicuri da usare perché assicurano che tutti i computer visualizzino correttamente i colori durante l'esecuzione di una tavolozza di 256 colori -
000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF |
CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |