Aula de "Cores para Web", ministrada para as cadeiras de Design para Meios Digitais (Curso de Publicidade) e Web Design (Curso de Design), da FANOR, em Outubro de 2013.

1. Cores para Web
@richarley

2. Cor resulta da existência
de luz
* Preto é ausência de luz
* Branco é a presença total de luz

3. Monitores
* Cores em RGB
* Imagens reproduzidas em pixels
* Cada pixel iluminado em Vermelho (R),
Verde (G) e Azul (B)

4. Escalas de cores
* Escala numérica de 0 à 255
Ex.: R (232) G (36) B (110)
* Escala hexadecimal para HTML
Ex.: #e8246e

5. Círculo cromático RGB
Vermelho (R)
Laranja
Rosa
Amarelo
Magenta
Verde limão
Roxo
Verde (G)
Turquesa
Azul (B)
Ciano
Azul oceano

6. Círculo cromático RGB
R (255) G (0) B (0)
R (255) G (127) B (0)
#FF0000
R (255) G (0) B (127)
#FF7F00
#FF007F
R (255) G (255) B (0)
R (255) G (0) B (255)
#FFFF00
#FF00FF
R (127) G (255) B (0)
R (127) G (0) B (255)
#7FFF00
#7F00FF
R (0) G (255) B (0)
R (0) G (0) B (255)
#00FF00
#0000FF
R (0) G (255) B (127)
#00FF7F
R (0) G (127) B (255)
R (0) G (255) B (255)
#00FFFF
#007FFF

7. Harmonia
* Monocromática

8. Harmonia
* Análoga

9. Harmonia
* Complementar

10. Harmonia
* Triádica

11. Harmonia
* Complemento dividido

12. Harmonia
* Dupla complementar

13. Temperatura
* Quentes
* Frias
* Neutras

14. Exemplos sites
* Cores quentes

15. Exemplos sites
* Cores frias

16. Exemplos sites
* Cores neutras

17. Recomendações para uma
boa paleta de cores
* Trabalhar com cores complementares
* Se preocupar com o contraste
(Legibilidade dos textos)
* Não ter medo de usar cores vibrantes

18. Ferramentas online para
paletas de cores
* Kuler:
kuler.adobe.com
* Color Scheme Designer:
colorschemedesigner.com

19. Atividade em classe
* Com base nos conceitos de harmonia dados em
classe, definir 2 paletas de cores distintas para
sites corporativos dos seguintes tipos de clientes:
1. Vidraçaria;
2. Loja de material de construção;
3. Boate de música eletrônica.
Atividade em casa
* Preparar uma proposta de paleta de cores
inicial para o portfólio.