Cores no CSS: RGB e Hexadecimal

São formas diferentes de representar cores. No final, é tudo cor — só muda o jeito de escrever.

RGB (Red, Green, Blue)

Funciona misturando luz:

R = vermelho

G = verde

B = azul

Cada um vai de 0 a 255

Exemplo:

color: rgb(255, 0, 0);

Vermelho puro.

Como pensar:

rgb(0, 0, 0) → preto
rgb(255, 255, 255) → branco
rgb(0, 0, 255) → azul

RGBA (RGB + Alpha)

É igual ao RGB, mas com transparência.

Exemplo:

color: rgba(vermelho, verde, azul, alpha);

O que é o alpha?

É o nível de transparência:

1 → totalmente visível

0 → totalmente transparente

valores entre → meio transparente

Hexadecimal (#)

É outra forma de escrever RGB, mas em base 16

Formato:

color: #RRGGBB;

Também é vermelho

Como ler:

#ff0000 → vermelho
#00ff00 → verde

#0000ff → azul

Versão curta (atalho)

Se os números repetem, dá pra reduzir:

#ffffff → #fff

#000000 → #000

RGB vs HEX (diferença prática)

RGB → mais intuitivo pra ajustar cor (mistura)

HEX → mais comum em layouts e design

Os dois fazem a mesma coisa.

Dica que vai te ajudar MUITO

Se você pega cor de design (tipo Figma, Pinterest, etc): Geralmente vem em HEX.

Dica!!!

Cores RGB e HEX

RGB usa valores de 0 a 255 para vermelho, verde e azul.

HEX usa código hexadecimal (#RRGGBB) para representar cores.

Ambos definem cores no CSS.