As tabelas de cores são importantes para você definir um bom design de seu blog! As tabelas de cores html ajudam você definir qual padrão de cor você vai poder começar a usar em seu projeto.

Antes de mostrar todos os detalhes e os códigos de cores para você, vejamos alguns detalhes muito importantes antes! 😉

Sempre que iniciar qualquer novo projeto de design ( seja em seu próprio blog ou de algum cliente ), você deve normalmente analisar todos os detalhes relevantes do projeto.

As cores bem combinadas são simplesmente surpreendentes!

Você pode definitivamente usar sua cor favorita para um blog, mas seria adequado você usar cores que os seus leitores estarão felizes de se conectar. Vou explicar melhor…

Quando você está falando sobre os objetivos de negócios mais específicos, e em crescimento real, uma abordagem mais científica para o esquema de cores que você associa com a sua marca é muito importante.

Você precisa entender a importância da ‘psicologia das cores‘ e como ela pode, em última instância, influenciar os seus resultados.

O que é a psicologia das cores?

As cores estão em torno de nós e elas nos afetam de muitas maneiras diferentes. Elas podem desencadear certas emoções e humores. Algumas pesquisas explicam como as cores podem afetar o seu cliente ou o comportamento do visitante de um blog/site no sentido de uma marca. Em termos simples, podemos influenciar a forma como as pessoas respondem ao nosso projeto.

Vejamos algumas cores populares e o impacto que elas tendem a criar:

Azul

Inspira: Confiança, responsabilidade, segurança e simpatia.

Usado por: Facebook, PayPal, Skype e Ford

Verde

Inspira: Natureza, dinheiro, equilíbrio, energia e saúde.

Usado por: Starbucks, Animal Planet e Whatsapp

Laranja

Inspira: Alegria, emoção, agressão e ação.

Utilizado por: Fanta e Soundcloud

Marrom

Inspira: Conforto, orgânico, simpatia e confiável.

Usado por: Hershey, Instagram e UPS

Preto

Inspira: Energia, classe, elegância, Mágoa e Prestígio.

Utilizado por: Johnnie Walker, Chanel e Nike

Rosa

Inspira: Feminilidade, amor, bondade e Romance.

Utilizado por: Victoria Secrets e Barbie

Roxo

Inspira: Criatividade, dignidade, autoridade e sabedoria.

Usado por: Yahoo, Hallmark e Cadbury

Vermelho

Inspira: Paixão, raiva, perigo, energia e atenção

Usado por: CocaCola, Canon, Levis e Virgin

Agora podemos ter uma noção de como as emoções que evocam o uso de cores podem ajudar a aumentar a taxa de conversão de seu blog.

Agora vou apresentar as tabelas de cores, cores html e código de cores Rgb disponíveis para você poder usar adequadamente em seu blog. Vamos lá 😉

Cores (Código html)

As ferramentas de Códigos de cores HTML ajuda você a encontrar cores HTML específicas para o seu site/blog. Grandes ferramentas como a Cartela de cores HTML e a Color Picker HTML vão deixar as coisas bem mais fáceis do que você imagina ( veja abaixo as ferramentas ).

Para iniciar rapidamente usando cores HTML em seu site, dê uma olhada em “Como usar códigos de cores HTML”, no tópico abaixo . Se você quiser saber o que estas combinaççoes de caracteres em códigos HTML significa, dê uma olhada na seção “Teoria dos códigos de cores HTML” abaixo.

Com esta dinâmica dessas cartela de cores HTML você pode obter códigos de referência para as cores básicas.

Clique em qualquer quadrado de cor para obter o seu código de cores HTML . Veja a lista de cores recentemente selecionadas ( clique nas imagens ).

>> Clique Aqui Para Acessar a Ferramenta de Código de Cores Html <<

Você também pode selecionar através de outra ferramenta…

>> Clique Aqui Para Usar Gratuitamente a Ferramenta de Código de Cores Html <<

Espaços de Cores RGB ( Rgb Color Space )

“RGB Color Space” ou Sistema de cores RGB, constrói todas as cores a partir da combinação do vermelho, verde e cores azuis.

O uso do vermelho, verde e azul ( 8 bits cada ), têm valores inteiros de 0 a 255. Isso faz com que 256*256*256=16777216 cores possíveis.

RGB ≡ Vermelho, Verde, Azul ( Red, Green and Blue )

Cada pixel no monitor LCD exibe cores desta forma, por combinação de LEDs vermelhos, verdes e azuis (diodos emissores de luz).

Quando o pixel vermelho é definido como “0” ( zero ), o LED é desligado. Quando o pixel vermelho está definido para “255”, o LED está ligado totalmente.

Qualquer valor entre eles define o LED de emissão de luz parcial.

Cores, Formatos e Cálculos RGB

O código RGB tem 24 bits de formato (bits 0..23):

RED[7:0]								GREEN[7:0]								BLUE[7:0]
23							16	15							8	7							0

RGB = (R*65536)+(G*256)+B , (quando R é vermelho, G é verde e B é azul)

Exemplos de Cálculos

Cor Branca RGB

Código RGB Branco = 255*65536+255*256+255 = #FFFFFF

Cor Azul RGB

Código RGB Azul = 0*65536+0*256+255 = #0000FF

Cor Vermela RGB

Código RGB Vermelho = 255*65536+0*256+0 = #FF0000

Cor Verde RGB

Código RGB Verde = 0*65536+255*256+0 = #00FF00

Cor Cinza RGB

Código RGB Cinza = 128*65536+128*256+128 = #808080

Cor Amarela RGB

Código RGB Amarelo = 255*65536+255*256+0 = #FFFF00

Abaixo um Infográfico com as tabelas de Cores html completa com nomes, códigos e Rgb das cores.

Fontes: www.htmlcolorcodes.com

[optin-monster-shortcode id=”wugnc2cup95pebwgvxzf”]

Como Usar Nomes de Cores HTML

Assim como códigos de cores Hex, nomes de cores HTML podem ser usados com estilos HTML incorporados ou em uma folha de estilo CSS separada.

HTML

<!-- Em Seu Documento HTML -->
<body>
  <h1 style="color:IndianRed">Texto de título vermelho indiano</h1>
  <p style="color:SlateGray">Texto de parágrafo cinza ardósia</p>
</body>

CSS

/* Em seu .css stylesheet */
h1 { color: IndianRed; }
p { color: SlateGray; }

Conclusão

Você pode ver que com o uso cuidadoso de psicologia das cores em seu projeto, você pode criar tanto uma experiência mais memorável para os seus visitantes, bem como um resultado mais eficaz para o seu cliente.

Você também pode facilitar sua vida usando as ferramentas de cores html disponíveis aqui! 😉

Gostou do artigo sobre tabelas de cores html? Deixe seu comentário abaixo, ele é muito importante para mim! Assim podemos trocar mais ideias sobre design. Além disso siga o GerandoBlogs no Instagram e Facebook!