Background avançado:
Cores RGBA
Um valor de cor RGBA é especificado com: rgba (vermelho, verde, azul, alfa). O parâmetro alfa é um número entre 0,0 (totalmente transparente) e 1,0 (totalmente opaco).
VERMELHO: rgba(255, 0, 0, 1.0);
VERDE: rgba(0, 255, 0, 1.0);
AZUL: rgba(0, 0, 255, 1.0);
VERMELHO: rgba(255, 0, 0, 0.5);
VERDE: rgba(0, 255, 0, 0.5);
AZUL: rgba(0, 0, 255, 0.5);
Cores HSL
Um valor de cor HSL é especificado com: hsl (matiz, saturação, claridade).
O matiz é um grau na roda de cores (de 0 a 360):
0 (ou 360) é vermelho; 120 é verde e 240 é azul.
VERMELHO: hsl(360, 100%, 50%);
VERDE: hsl(120, 100%, 50%);
AZUL: hsl(240, 100%, 50%);
VERMELHO: hsl(0, 100%, 50%);
CSS Opacidade
Essa propriedade define a opacidade de todo o elemento (a cor de fundo e o texto serão opacos / transparentes).
VERMELHO Opaco: rgba(255, 0, 0);opacity:0.1;
Usando transparencia
Podemos usar para criar uma cor de fundo transparente para um elemento.
GREEN
TRANSPARENTE
A palavra-chave currentcolor
Exemplo: Cor atribuída ao elemento green. Aplicamos: border: 10px solid currentcolor;
Dá consistência ao valor atual da propriedade color de um elemento.