Todos os navegadores da web modernos suportam cores diferentes para manter uma tela colorida. No CSS, as cores podem ser representadas de várias maneiras, mesmo usando um nome de cor como “cor azul”. No entanto, esse método suporta apenas nomes de cores específicos. Portanto, no CSS, outros métodos avançados são usados ​​para exibir cores como RGB, HSL, Hex, etc.

Neste artigo, três métodos de representação de cores: RGB, RGBA e Hex são discutidos. No CSS, RGB () é uma função interna, o RGBA também é um formato de cores de exibição com a extensão do alfa. Além disso, fornecer valores de cores em números hexadecimais também é amplamente utilizado no CSS.

função rgb () no CSS

RGB é uma combinação de três cores (vermelho, verde e azul) que é usado em todos os sistemas de computador para exibição colorida. Como sabemos, essas são as cores básicas e, combinando -as, podemos obter qualquer cor que seja visível no espectro de cores.

No CSS, essas cores são definidas na forma de uma função rgb (): (vermelho, verde, azul). O alcance de todas essas cores é definido de 0 a 255 define a intensidade de uma cor, e podemos alterar as cores alterando esses valores. A intensidade dessas cores é bem definida no exemplo dado.

Exemplo

RGB (0, 255, 0)

Essa combinação retorna a cor verde porque tem a maior intensidade e as outras duas cores têm 0 intensidade.

Alterando as intensidades das três cores, temos as diferentes cores, como

• RGB (255, 255, 255) exibe a cor branca
• e RGB (0, 0, 0) dá a cor preta.

Outros exemplos de cores são mostrados no exemplo dado

Exemplo

RGB (0, 255, 0)

RGB (60, 60, 60)

RGB (138, 238, 130)

RGB (255, 255, 255)

Cores RGBA

No CSS RGBA, também é um formato para exibir cores com a extensão do alfa. A estrutura desta função de cor é dada abaixo.

RGBA (vermelho, verde, azul, alfa)

Nesta função, um alfa é usado para expressar a opacidade de uma cor. Na propriedade CSS Opacity é usada para definir a transparência de uma cor e seu alcance fica entre 0.0 a 1.0, onde 0.0 representa o totalmente transparente e 1.0 representa o totalmente opaco. Você entenderá melhor do exemplo dado.

Exemplo

Verde

Verde

Verde

Verde

Verde

No exemplo acima dado, definimos o valor de alfa de 0.0 (totalmente transparente) a 1.0 (totalmente opaco) e você pode ver a diferença de intensidade da transparência.

Cores hexáticas CSS

Nas cores CSS também podem ser especificadas com valores hexadecimais, é apenas outra maneira de representar as cores. No CSS, é a maneira mais comum de especificar uma cor usando valores hexadecimais com um sinal " #" como #rrggbb. Enquanto que, r, g, b são os códigos para vermelho, verde e azul, respectivamente.

Números hexadecimais com a combinação de 0-9 e A-F são usados ​​para representar uma cor no CSS. Alguns exemplos de cores hexadecimais básicas são fornecidas abaixo:

• #ffffff: representa a cor branca e
• #000000: representa a cor preta.

Para uma melhor compreensão, dê uma olhada no exemplo a seguir.

Exemplo

Especifique cores usando valores hexadecimais

#0f4bff

#3CB371

EE652E

#ffa500

#6A5ACD

No exemplo acima, cores diferentes são exibidas usando os valores hexadecimais. Todos esses valores hexadecimais são a combinação de números hexadecimais, que são 16 valores alfa-numéricos distintos que estão entre 0-9 e A-F.

Conclusão

RGB, RGBA e Hex são os diferentes tipos para exibir cores no CSS. Enquanto o RGB é uma combinação de três cores (vermelha, verde e azul), o RGBA é o mesmo que o RGB com a extensão do alfa (alfa = transpelancia) e o hexágono usa os valores hexadecimais para representar cores. A faixa de cores RGB e hexadecimal está entre 0 e 255 inteiro e 00 e FF, respectivamente. Todos esses três tipos estão bem definidos com exemplos.