Codice lilla. Il colore negli stili può essere impostato in diversi modi: per valore esadecimale, per nome, in formato RGB, RGBA, HSL, HSLA

I numeri esadecimali vengono utilizzati per specificare i colori. Il sistema esadecimale, a differenza del sistema decimale, si basa, come suggerisce il nome, sul numero 16. I numeri saranno i seguenti: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. I numeri da 10 a 15 sono sostituiti da lettere latine. I numeri maggiori di 15 nel sistema esadecimale sono formati combinando due numeri in uno. Ad esempio, il numero 255 in decimale corrisponde al numero FF in esadecimale. Per evitare confusione nella definizione del sistema numerico, il numero esadecimale è preceduto dal simbolo cancelletto #, ad esempio #666999. Ciascuno dei tre colori - rosso, verde e blu - può assumere valori da 00 a FF. Pertanto, la designazione del colore è divisa in tre componenti #rrggbb, dove i primi due caratteri segnano la componente rossa del colore, i due centrali segnano il verde e gli ultimi due segnano il blu. È consentito utilizzare la forma abbreviata #rgb, dove ogni carattere deve essere raddoppiato. Pertanto, la voce #fe0 dovrebbe essere considerata come #ffee00.

per nome

I browser supportano alcuni colori in base al nome. In tavola. 1 mostra i nomi, il codice esadecimale, i valori in formato RGB, HSL e la descrizione.

Con RGB

Puoi definire un colore usando i valori rosso, verde e blu in termini decimali. Ciascuno dei tre componenti del colore assume un valore da 0 a 255. È anche accettabile impostare il colore come percentuale, mentre 100% corrisponderà al numero 255. Innanzitutto, viene specificata la parola chiave rgb, quindi i componenti del colore sono specificato tra parentesi, separati da virgole, ad esempio rgb(255 , 128, 128) o rgb(100%, 50%, 50%).

RGBA

Il formato RGBA è simile nella sintassi a RGB, ma include un canale alfa che imposta la trasparenza dell'elemento. Un valore di 0 è completamente trasparente, 1 è opaco e un valore intermedio come 0,5 è traslucido.

RGBA viene aggiunto a CSS3, quindi la convalida del codice CSS dovrebbe essere eseguita secondo questa versione. Va notato che lo standard CSS3 è ancora in fase di sviluppo e alcune sue caratteristiche potrebbero cambiare. Ad esempio, un colore RGB aggiunto alla proprietà background-color supera la convalida, ma non uno aggiunto alla proprietà background. Allo stesso tempo, i browser comprendono abbastanza correttamente il colore per entrambe le proprietà.

HSL

Il nome del formato HSL è formato dalla combinazione delle prime lettere Hue (tonalità), Saturate (saturazione) e Lightness (leggerezza). Tonalità è il valore del colore sulla ruota dei colori (Fig. 1) ed è specificato in gradi. 0° è rosso, 120° è verde e 240° è blu. Il valore della tonalità può variare da 0 a 359.

Riso. 1. Ruota dei colori

La saturazione è l'intensità di un colore, misurata come percentuale da 0% a 100%. Un valore di 0% indica nessun colore e una sfumatura di grigio, 100% è il valore di saturazione massimo.

Luminosità imposta la luminosità del colore ed è specificata come percentuale da 0% a 100%. Valori piccoli rendono il colore più scuro, mentre valori alti lo rendono più chiaro, valori estremi di 0% e 100% corrispondono al bianco e nero.

HSLA

Il formato HSLA è simile nella sintassi a HSL, ma include un canale alfa che imposta la trasparenza dell'elemento. Un valore di 0 è completamente trasparente, 1 è opaco e un valore intermedio come 0,5 è traslucido.

I valori di colore nei formati RGBA, HSL e HSLA vengono aggiunti a CSS3, quindi quando si utilizzano questi formati, verificare la validità del codice rispetto alla versione.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Un avvertimento

Tutti i metodi per catturare un leone elencati sul sito sono teorici e basati su metodi computazionali. Gli autori non garantiscono la vostra sicurezza durante l'utilizzo e declinano ogni responsabilità per il risultato. Ricorda, il leone è un predatore e un animale pericoloso!

Il risultato di questo esempio è mostrato in Fig. 2.

Riso. 2. Colori sulla pagina web

Questa pagina contiene una tabella con parole chiave che possono essere utilizzate per designare i colori in linguaggi di sviluppo Web come: HTML, CSS, JavaScript, Flash, ecc.

Nella vecchia specifica WC3, solo 16 parole chiave venivano utilizzate per impostare i colori in HTML e CSS. In specifiche successive, più moderne, sono state aggiunte altre 130 parole chiave per denotare i nomi dei colori. La tabella seguente contiene i nomi dei colori, i codici esadecimali e RGB a cui corrispondono.

Secondo le regole CSS, i nomi dei colori non fanno distinzione tra maiuscole e minuscole. Le voci di colore IndianRed e indianred sono equivalenti.

Vale anche la pena notare che su 146 parole chiave nella tabella, ci sono effettivamente meno colori in essa. Questo perché alcune delle parole chiave si riferiscono allo stesso colore. Quindi i nomi Gray e Gray stanno per grigio al 50% con il codice #808080, mentre la parola Magenta è un sinonimo HTML per il colore Fucsia, corrispondente al codice esadecimale #FF00FF. Anche le parole Aqua e Cyan sono sinonimi, corrispondono al codice #00FFFF .

Tabella (tavolozza) di colori html ti dà la possibilità di scegliere autonomamente il tono di cui hai bisogno. Il valore del colore viene visualizzato in tre formati: Hex, RGB e HSV.

• Hex è composto da tre valori di due caratteri in notazione esadecimale. Ad esempio: #ff00b3, dove la prima coppia di numeri è rossa, la seconda è verde e la terza è blu.
• RGB (RedGreenBlue) ha la forma "200,100,255" che indica la quantità del tono corrispondente (rosso, verde, blu) nel colore risultante.
• HSV (Tonalità, Saturazione, Valore - tono, saturazione, valore) - un modello di colore in cui le coordinate sono:
  • Tonalità - tonalità di colore, può variare da 0° a 360°.
  • Saturazione - saturazione, varia tra 0-100 o 0-1. Maggiore è questa impostazione, più "puro" è il colore, motivo per cui questa impostazione viene talvolta definita purezza del colore. E più questo parametro è vicino a zero, più il colore è vicino al grigio neutro.
  • Valore (valore colore) - imposta la luminosità, il valore può anche variare tra 0-100 o 0-1.

Inserisci il codice colore: ANDARE

Elenco di colori con nomi

La tabella elenca i nomi dei colori inglesi (che possono essere usati come valori) supportati da tutti i browser e i loro valori esadecimali. Tutti i colori elencati sono "sicuri", il che significa che verranno visualizzati allo stesso modo in tutti i browser.

I codici colore nei CSS vengono utilizzati per specificare i colori. In genere, i codici colore oi valori di colore vengono utilizzati per impostare un colore per il primo piano di un elemento (ad es. testo, colore del collegamento) o per lo sfondo dell'elemento (sfondo, colore del blocco). Possono anche essere usati per cambiare il colore dei pulsanti, i bordi, i pennarelli, il passaggio del mouse e altri effetti decorativi.

Puoi impostare i tuoi valori di colore in vari formati. La tabella seguente elenca tutti i formati possibili:

Questi formati sono descritti più dettagliatamente di seguito.

Colori CSS - Codici esadecimali

Codice colore esadecimaleè una rappresentazione del colore a sei cifre. Le prime due cifre (RR) sono il valore rosso, le due successive sono il valore verde (GG) e le ultime due sono il valore blu (BB).

Colori CSS - Codici esadecimali brevi

Codice colore esadecimale breveè una forma più breve di notazione a sei caratteri. In questo formato, ogni cifra viene ripetuta per produrre il valore di colore equivalente a sei cifre. Ad esempio: #0F0 diventa #00FF00.

Il valore esadecimale può essere preso da qualsiasi software di grafica come Adobe Photoshop, Core Draw, ecc.

Ogni codice colore esadecimale in CSS sarà preceduto da un cancelletto "#". I seguenti sono esempi dell'uso della notazione esadecimale.

Colori CSS - Valori RGB

Valore RGBè un codice colore impostato utilizzando la proprietà rgb(). Questa proprietà assume tre valori: uno ciascuno per rosso, verde e blu. Il valore può essere un numero intero, da 0 a 255, o una percentuale.

Nota: Non tutti i browser supportano la proprietà color rgb(), quindi non è consigliabile utilizzarla.

Di seguito è riportato un esempio che mostra più colori utilizzando i valori RGB.

Generatore di codici colore

Puoi creare milioni di codici colore con il nostro servizio.

Colori sicuri del browser

Di seguito è riportata una tabella di 216 colori che sono i più sicuri e indipendenti dal computer. Questi colori in CSS vanno da 000000 a FFFFFF codice esadecimale. Sono sicuri da usare in quanto assicurano che tutti i computer visualizzino i colori correttamente quando si lavora con la tavolozza a 256 colori.

I colori HTML sono indicati da sei caratteri dopo la barra, ad esempio #000000. Questi sei caratteri rappresentano le proporzioni dei vari colori (rosso, verde e blu) nel colore finale. L'immagine sul monitor del tuo computer è composta da un numero enorme di punti chiamati pixel. Ogni pixel è una piccola fonte di luce, chiamiamola "torcia", che a sua volta è composta da tre torce: rossa, verde e blu. Riducendo o aumentando l'intensità del bagliore delle singole lanterne colorate, otteniamo il colore desiderato.

codici colore html

I colori in HTML sono indicati dalla notazione esadecimale (HEX) per la combinazione di rosso, blu e verde (RGB).

Il valore del colore più piccolo è 0 (00 esadecimale). Il valore di colore più alto è 255 (FF esadecimale).

Il valore del colore esadecimale è di tre cifre che iniziano con #.

Codici colore (valori)

16 milioni di sfumature

Combinando rosso, blu e verde con valori che vanno da 0 a 255 per ogni colore si ottengono oltre 16 milioni di sfumature (256 x 256 x 256).

La maggior parte dei monitor moderni è in grado di visualizzare almeno 16.384 diverse tonalità (i monitor LCD sono generalmente in grado di visualizzare 262.16 milioni di (aggiornato ottobre 2013) colori, mentre i monitor CRT possono visualizzare un numero quasi illimitato di colori).

La tabella dei colori sottostante mostra la variazione della proporzione del rosso da 0 a 255 con valori zero per il blu e il verde:

sfumature di grigio

Per ottenere sfumature di grigio, vengono utilizzate proporzioni uguali di tutti i colori. Per facilitare la scelta del colore desiderato, ti forniamo i codici per le sfumature di grigio.

Nomi di colori html cross-browser (per tutti i browser).

Una raccolta di 150 nomi di colori html supportati in tutti i browser.

Nomi di colore standardizzati

Il W3C elenca 16 nomi di colori validi per HTML e CSS: acqua (acquamarina), nero (nero), blu (blu), fucsia (magenta), grigio (grigio), verde (verde), lime (lime o verde chiaro), marrone (castagno), blu marino (oltremare), oliva (oliva), viola (viola), rosso (rosso), argento (argento), verde acqua (grigio), bianco (bianco) e giallo (giallo).

Quando si utilizzano colori non inclusi in questo elenco, sarà più corretto utilizzare il loro codice esadecimale (HEX) o il codice RGB.

Colori sicuri

Alcuni anni fa, quando i computer potevano supportare un massimo di 256 colori diversi, è stato proposto un elenco di 216 "Colori Web Safe", con 40 colori riservati al sistema.

Questa tavolozza a 216 colori è stata creata per visualizzare correttamente i colori nella modalità tavolozza a 256 colori.

Non importa ora perché la maggior parte dei computer in tutto il mondo supporta milioni di sfumature di colore. In ogni caso, ecco un elenco di quei colori: