Cores CSS
Valores de cor
CSS permite que você especifique cores de 24 bits (que é 16.777.216 cores!) De propriedades como a cor do texto, cor de fundo e cor de borda para incrementar seus projetos. Você pode usar nomes de cores, a notação hexadecimal ou RGB (vermelho, verde, azul) notação.
Nomes de cores CSS
Para facilitar as coisas, CSS inclui 16 nomes de cores padrão na planície Inglês, bem como mais de 100 nomes de cores alargada. Aqui está uma lista dos mais padrão:
| Nome de cor | Saída |
|---|---|
| aqua | |
| black | |
| blue | |
| fuchsia | |
| gray | |
| green | |
| lime | |
| maroon | |
| navy | |
| olive | |
| purple | |
| red | |
| silver | |
| teal | |
| white | |
| yellow |
Além disso, você pode definir um valor de cor para None ou transparente para evitar que o elemento de desenho qualquer cor (outros elementos para trás ele irá mostrar através).
Cores Hexadecimal
Apesar de nomes de cores bastante útil às vezes, eles são muito poucos para atender a cada projeto. Para bater em toda a gama de cores de 24 bits você pode usar valores hexadecimais.
Cores hexadecimais são formados por um sinal de sustenido # seguido de um número hexadecimal de 6 dígitos como #ff065c . Os 2 primeiros dígitos representam o componente de cor vermelha, o segundo par é o verde eo terceiro é o componente azul. O seu valor pode variar de 00 a FF #000000 ser negro e #ffffff ser branco.
| Hex cor | Saída |
|---|---|
| #000 | |
| #3b948d | |
| #aed527 | |
| #ff7612 | |
| #fff |
Talvez você tenha notado que eu escrevi #000 em vez de #000000 para a exibição de cor preta. Esta é uma notação abreviada que indica o dígito de cada par, apenas uma vez, cada par consiste nos mesmos dígitos. Por exemplo #eeeeee pode ser escrito como #eee , #3399cc como #39c e assim por diante. Use esta sempre que possível para reduzir o tamanho de seu código CSS.
Cores RGB
Last but not least você também pode especificar valores de cor usando o modelo RGB (vermelho, verde, azul). É basicamente como cores hexadecimal, mas ao invés de pares de hexadecimal que você está usando valores decimais de 0 a 255 para cada componente de cor como rgb(red,green,blue) .
| Cor RGB | Saída |
|---|---|
| rgb(0,0,0) | |
| rgb(59,148,141) | |
| rgb(174,213,39) | |
| rgb(255,118,18) | |
| rgb(255,255,255) |
Você já pode ver que a notação RGB produz mais do que o código hexadecimal, enquanto fazendo exatamente a mesma coisa. Por esta razão RGB raramente é usado durante hex. A maioria dos softwares gráficos cores de exibição em formato RGB e HEX de qualquer maneira.
Cor do texto
O color propriedade pode ser usada para mudar a cor do texto. Ela pode ser aplicada a qualquer elemento HTML que contém texto.
Cor CSS
Saída
Cor de fundo
O background-color propriedade pode ser usada para mudar a cor de fundo de praticamente qualquer elemento HTML.