Podemos especificar um nome de cor, como "red" ou "darksalmon". Temos a lista completa dos nomes possíveis aqui.
Normalmente vamos querer ser mais precisos, e para isso temos a
sintaxe RGB que nos permite dar os valores exatos da cor que
queremos no formato rgb(200, 170, 50)
. Para cada valor
podemos ir de 0 a 255.
Outra forma corrente de especificar cores em CSS é com o formato
#ffa020
. Esta é outra forma de indicar valores RGB
usando um formato hexadecimal, em que cada par de caracteres a
seguir ao cardinal (#
) representa um valor:
ff
= 255a0
= 16020
= 20
Ou seja, #ffa020
é o mesmo que
rgb(255, 160, 20)
. Podes ler um pouco mais sobre
o formato hexadecimal neste artigo.
Também podemos indicar uma cor no formato HSL (Hue, Saturation,
Lightness) no formato hsl(135, 40%, 50%)
. O primeiro valor
(Hue) pode ir de 0 a 255, enquanto que os outros dois (Saturation e
Lightness) são expressos em percentagem, de 0% a 100%.
Tanto os formatos RGB como HSL nos permitem indicar um valor extra
de opacidade, de 0 a 1. Para isso mudamos "hsl" para "hsla" ou "rgb"
para "rgba" e acrescentamos o valor da opacidade: hsla(135, 40%, 50%, 0.6);