Códigos de cores de redes sociais e logos famosos

11
30518

Esses dias estava eu desenhando uns botões de rede social quando precisei saber rapidinho o código da cor azul característica do Facebook. Mesmo sendo fácil descobrir o hexadecimal de uma cor no Photoshop, é ainda mais fácil jogar "Facebook hex color" no Google e ver no que dá, não é verdade?

Foi assim que encontrei uma lista pequena num site gringo e resolvi ampliá-la, e deu nisso aqui: um listão de códigos de cores de vários sites e serviços online, além de algumas marcas famosas.

Se você conhece design web o bastante pra estilizar seus blogs ou sites, deve saber como usar os códigos. Em todo o caso, é simples: digamos que você quer um botão estilizado com CSS usando a mesma cor do Yahoo!, aquele tom lilás. É só copiar o hexadecimal da lista e usar na folha de estilos, por exemplo:

background: #400191;

Também pode usar o código rgb, que em CSS fica assim:

background: rgb(64,1,145);

Mas se você manja dos CSSs, já deve saber isso... Bem, fique aí com a lista e se tiver alguma cor de marca que faltou e está precisando, comente e a lista vai sendo ampliada.

Nota: tem outro jeito muito fácil de pegar o código de cores de qualquer lugar: é só usar alguma extensão no navegador. Pra quem, como eu, usa o Chrome, tem o ColorZilla, que oferecerá um conta-gotas com essa finalidade: é só clicar no lugar de onde quer copiar a cor e pronto. Existe também pra Firefox.

Nota 2: dica rápida é que você também pode definir a cor em rgba, assim terá o quarto canal como transparência do objeto. Supondo que quero aquele mesmo botão do Yahoo! ficando semi-transparente ao passar o mouse, seria só criar um estilo "hover" com a cor de fundo assim:

background: rgba(64,1,145,0.5);

E teria 50% de transparência, lembrando que varia de 0 (totalmente transparente) até 1 (totalmente opaco). Mas sem mais enrolação, a lista:

Facebook
HEX: #3b5998
RGB: 59, 89, 152

Twitter
HEX: #00aced
RGB: 0, 172, 237

Google+
HEX: #dd4b39
RGB: 221, 75, 57

YouTube
HEX: #bb0000
RGB: 187, 0, 0

Linkedin
HEX: #007bb6
RGB: 0, 123, 182

Instagram
HEX: #517fa4
RGB: 81, 127, 164

Pinterest
HEX: #cb2027
RGB: 203, 32, 39

Quora
HEX: #a82400
RGB: 168, 36, 0

Flickr (rosa)
HEX: #ff1981
RGB: 255, 25, 129

Flickr (azul)
HEX: #006add
RGB: 0, 106, 221

Tumblr
HEX: #385774
RGB: 56, 87, 116

VK
HEX: #45668e
RGB: 69, 102, 142

Vimeo (azul)
HEX: #20b9eb
RGB: 32, 185, 235

Vimeo (verde)
HEX: #aad450
RGB: 170, 212, 80

Foursquare
HEX: #0072b1
RGB: 0, 114, 177

Adobe
HEX: #ff0000
RGB: 255, 0, 0

deviantART (verde)
HEX: #627870
RGB: 98, 120, 112

deviantART (amarelo)
HEX: #bbd353
RGB: 187, 211, 83

AIM
HEX: #fdd500
RGB: 253, 213, 0

Amazon
HEX: #ff6600
RGB: 255, 102, 0

Android
HEX: #a4c639
RGB: 164, 198, 57

Behance
HEX: #1769ff
RGB: 23, 105, 255

Bing
HEX: #fcd116
RGB: 252, 209, 22

Blogger
HEX: #f57d00
RGB: 245, 125, 0

bitly (laranja)
HEX: #ee6123
RGB: 238, 97, 35

bitly (azul)
HEX: #61b3de
RGB: 97, 179, 222

Coca-Cola
HEX: #ed1c16
RGB: 237, 28, 22

Orkut
HEX: #f82790
RGB: 248, 39, 144

Dropbox
HEX: #007ee5
RGB: 0, 126, 229

Excel
HEX: #008641
RGB: 0, 134, 65

Google (ícone)
HEX: #4c89e3
RGB: 76, 137, 227

HTML5
HEX: #e34f26
RGB: 227, 79, 38

Last FM
HEX: #c3000d
RGB: 195, 0, 13

LinkedIn
HEX: #0976b4
RGB: 9, 118, 180

McDonald's (vermelho)
HEX: #d3222a
RGB: 211, 34, 42

McDonald's (amarelo)
HEX: #ffc82d
RGB: 255, 200, 45

PayPal 1
HEX: #253b80
RGB: 37, 59, 128

PayPal 2
HEX: #179bd7
RGB: 23, 155, 215

PowerPoint
HEX: #f04e23
RGB: 240, 78, 35

Rdio
HEX: #007dc3
RGB: 0, 125, 195

RSS
HEX: #f26522
RGB: 242, 101, 34

Skype
HEX: #00aff0
RGB: 0, 175, 240

Spotify
HEX: #7ab800
RGB: 122, 184, 0

Twitch.tv
HEX: #6441a5
RGB: 100, 65, 165

Word
HEX: #0054a6
RGB: 0, 84, 166

WordPress.org
HEX: #464646
RGB: 70, 70, 70

WordPress.com
HEX: #1e8cbe
RGB: 30, 140, 190

Yahoo!
HEX: #400191
RGB: 64, 1, 145

Xbox
HEX: #107b11
RGB: 16, 123, 17

PlayStation
HEX: #0069c1
RGB: 0, 105, 193

Windows 8
HEX: #00bcf2
RGB: 0, 188, 242

Linux Ubuntu
HEX: #dd4814
RGB: 221, 72, 20

WhatsApp
HEX: #34af23
RGB: 52, 175, 35

Windows Phone
HEX: #68217a
RGB: 104, 33, 122

Ask.fm
HEX #93ce00
RGB 147, 206, 0

eBay (vermelho)
HEX #e43137
RGB 228, 49, 55

eBay (azul)
HEX #0063d1
RGB 0, 99, 209

eBay (amarelo)
HEX #f4ae01
RGB 244, 174, 1

eBay (verde)
HEX #85b716
RGB 133, 183, 22

StackOverflow (laranja)
HEX #f47a20
RGB 244, 122, 32

StackOverflow (cinza)
HEX #818185
RGB 129, 129, 133

Google logo (vermelho)
HEX #da4d39
RGB 218, 77, 57

Google logo (azul)
HEX #1166e8
RGB 17, 102, 232

Google logo (amarelo)
HEX #ffc113
RGB 255, 193, 19

Google logo (verde)
HEX #009c58
RGB 0, 156, 88

About.me
HEX #00405d
RGB 0, 64, 93

Precisa de outro ou acha que faltou algum importante? Comente.

- Publicidade -

Receba atualizações do Tutoriart

É grátis, e você pode escolher entre receber só sugestões sobre arte, design gráfico, Photoshop, etc, ou só sobre WordPress, blogging, design web, snippets, etc. Ou tudo, se preferir!

Quero assinar...
Ao assinar, você concorda com os Termos de Privacidade.

11 COMENTÁRIOS

  1. Boa tarde, a logo do Paypal têm 2 tons de azuis. Quais são os códigos de ambos? Tem um mais escuro e um mais claro. Obrigada

DEIXE UMA RESPOSTA

Por favor, digite seu comentário!
Por favor, digite seu nome aqui