COLORI IN HTML

I colori in html possono essere indicati attraverso:

  • nomi colore 
  • valori rgb
  • valori rgba
  • valori hex
  • valori hsl
  • valori hsla

Nomi colore

I colori possono essere indicati attraverso i nomi di colori, attualmente html supporta 140 nomi di colore standard. 

Alcuni esempi di colori maggiormente diffusi :

la lista completa dei colori è disponibile sul sito ufficiale https://www.w3schools.com/colors/colors_names.asp


Valori RGB-RGBA

I colori in html possono essere espressi anche in valori  RGB ( ROSSO , VERDE , BLU ).

Ogni parametro definisce l’intensità del colore come un numero intero compreso tra 0 e 255.

Ad esempio, rgb (0,0,255) indica il colore blu,(0,255,0) indica il colore verde , (255,0,0)  indica il colore rosso.

  • nero (0,0,0)
  • blu (0,0,255)
  • marrone (128,0,0)
  • ciano (0,255,255)
  • fuxia (255,0,255)
  • grigio (128,128,128)
  • verde (0,255,0)
  • arancione (255,165,0)
  • rosa (255,192,203)
  • viola (128,0,128)
  • rosso (255,0,0)
  • bianco (255,255,255)
  • giallo (255,255,0)

I colori in html possono essere espressi anche in valori  RGBA ( ROSSO , VERDE , BLU,ALPHA ).

Dove il valore Alpha identifica il livello di trasparenza che va da 0,0(trasparente) ad 1,0 (opaco)

Valori Hex

I colori in html possono essere espressi anche in valori esadecimali ( #RRGGBB ).

Dove RR (rosso), GG (verde) e BB (blu) sono interi esadecimali compresi tra 00 e FF .

Ad esempio, # 0000FF viene visualizzato in blu, perché il componente blu è impostato sul valore più alto (FF) e gli altri su 00

  • nero (#000000)
  • blu (#0000ff)
  • marrone (#a52a2a)
  • ciano (#00ffff)
  • fuxia (#ff00ff)
  • grigio (#808080)
  • verde (#008000)
  • arancione (#ffa500)
  • rosa (#ffc0cb)
  • viola (#800080)
  • rosso (#ff0000)
  • bianco (#ffffff)
  • giallo (#ffff00)

Valori Hsl-Hsla

I colori in html possono essere espressi anche in valori HSL (hue,saturation,lightness) ovvero (tonalità,saturazione,luminosità).

  1. La tonalità si misura da 0 a 360 (0 è rosso, 120 è verde, 240 è blu)
  2. La saturazione è un valore percentuale (0% significa una sfumatura di grigio e 100% è il colore completo)
  3. La luminosità è un valore  percentuale (0% è nero, 100% è bianco)
  • nero (0, 0%, 0%)
  • blu (240,100%, 50%)
  • marrone (0,59%, 41%)
  • ciano (180,100%, 50%)
  • fuxia (300,100%, 50%)
  • grigio (0,0%, 50%)
  • verde (120,100%, 25%)
  • arancione (39,100%, 50%)
  • rosa (350,100%, 88%)
  • viola (300,100%, 25%)
  • rosso (0,100%, 50%)
  • bianco (0,0%, 100%) 
  • giallo (60, 100%, 50%)

I colori in html possono essere espressi anche in valori  HSLA dove , in maniera analoga ai colori RGBA abbiamo il valore Alpha che identifica la trasparenza.

Esempio di riepilogo

<html>
 <body>
 <p style="color:red">titolo rosso</p>
 <p style="color:hsl(120,100%,50%)">paragrafo verde</p>
 <p style="color:#ff00ff">paragrafo Fuxia</p>
 </body>
 </html>

Lascia un commento