🎨 Cores em HTML e CSS

Introdução

As cores são elementos fundamentais no desenvolvimento de páginas Web. Elas ajudam na comunicação visual, organização das informações e experiência do usuário.

Em HTML e CSS podemos definir cores em textos, fundos, bordas, imagens e diversos componentes da interface.

Onde utilizamos cores?

Propriedade color

A propriedade CSS color define a cor do texto.

p {

 color: blue;

}

Propriedade background-color

Define a cor de fundo de um elemento.

div {

 background-color:red;

}

Cores pelo Nome

O CSS possui nomes de cores pré-definidos.

color: red;

color: blue;

color: green;

Cores Hexadecimal

O formato hexadecimal representa cores utilizando seis caracteres precedidos pelo símbolo #.

color:#1f4e79;

Cores RGB

RGB representa as cores através de três valores: Red (vermelho), Green (verde) e Blue (azul).

color:rgb(255,0,0);

Transparência com RGBA

O RGBA adiciona o canal Alpha, permitindo controlar transparência.

background:

rgba(0,0,255,0.5);

Importância das Cores no Design

• Melhoram a comunicação visual.
• Criam identidade da marca.
• Facilitam a navegação.
• Destacam informações importantes.
• Melhoram a experiência do usuário.

Psicologia das Cores

Boas Práticas

• Utilize cores com propósito.
• Mantenha contraste adequado.
• Pense na acessibilidade.
• Evite excesso de cores.
• Utilize padrões visuais consistentes.

Resumo da Aula