Página de início do Canva
  1. Esquemas de cores do site aprovados pelo designer

The best website color schemes — and how to choose your own

Canva is the world's easiest design tool. And the best part? It's free. Create a colorful and engaging website in minutes. No design experience needed.
Create a website(abre em uma nova aba ou janela)
Screen Shot 2020-06-23 at 12.26.27 pm

Trabalha em uma grande organização com mais de 100 funcionários? Saiba como se comunicar visualmente, aumentar a produtividade e manter a marca, em escala. Entre em contato(abre em uma nova aba ou janela).

A cor(abre em uma nova aba ou janela) desempenha um papel subestimado na forma como percebemos o mundo ao nosso redor. Desde as nuvens escuras e sombrias que nos dizem que está prestes a chover até a luz verde que indica que é seguro atravessar a rua, sua influência está tão profundamente enraizada na vida cotidiana que, muitas vezes, mal a percebemos.

Isso também se estende ao design de um site(abre em uma nova aba ou janela). A paleta de cores do site(abre em uma nova aba ou janela) pode afetar profundamente a forma como os visitantes percebem a sua marca, mesmo que eles não se deem conta disso conscientemente! A boa notícia é que você pode usar isso a seu favor para garantir que a primeira impressão da sua marca seja positiva e memorável.

Dica: você pode experimentar diferentes paletas de cores de site mencionadas neste artigo para seu novo website usando o Construtor de Sites do Canva(abre em uma nova aba ou janela).

Índice

Neste artigo, abordamos tudo o que você precisa saber sobre paletas de cores de sites. Desde por que elas são tão importantes até os melhores esquemas de cores de sites para se inspirar e como escolher seu próprio esquema ao iniciar um blog(abre em uma nova aba ou janela), você encontrará tudo o que precisa para dar vida à sua criação.

O que é a paleta de cores de um site?

Antes de mais nada, a que exatamente estamos nos referindo quando dizemos “paleta de cores do site”? É mais do que apenas a cor do seu logotipo(abre em uma nova aba ou janela) ou até mesmo o plano de fundo do seu site. Ele abrange todas as cores(abre em uma nova aba ou janela) que aparecem em qualquer lugar do seu site - desde o cabeçalho e as seções do site até as cores do texto e dos botões e até mesmo os tons usados nas fotos(abre em uma nova aba ou janela). Todas elas se juntam para formar a paleta de cores geral, que molda a sensação, o humor e a estética do seu site.

Por que a paleta de cores do site é tão importante?

A paleta de cores(abre em uma nova aba ou janela) do seu site afeta a percepção que o público tem da sua marca em vários níveis diferentes. Ela pode ser um fator importante em tudo, desde o tempo que eles permanecem em seu site até o fato de clicarem ou não no botão “comprar”. Aqui estão alguns dos motivos pelos quais o esquema de cores do seu site requer uma análise cuidadosa.

Estética

Isso pode parecer óbvio, mas ninguém quer passar muito tempo em um site feio! Se a paleta de cores do seu site for desagradável ou causar dor de cabeça, provavelmente não demorará muito para que os visitantes procurem o botão “sair”. Por outro lado, se o seu site for harmonioso e esteticamente agradável, é muito mais provável que eles permaneçam nele.

Percepção da marca

Você sabia que a cor está ligada à psicologia? Esquemas de cores diferentes evocam sentimentos diferentes - por exemplo, o vermelho é confiante, o amarelo é divertido e o azul é confiável. De acordo com a Buffer, mais de 90% de nossa avaliação de um produto é feita apenas com base na cor, e isso também se aplica ao seu site. Isso significa que você pode definir o tom do seu site escolhendo um esquema de cores que reflita como você quer que seus visitantes se sintam.

Conversão

A paleta de cores do seu site também pode determinar se os visitantes do site realmente compram de você. De fato, a cor é tão poderosa que um estudo de caso recente descobriu que a escolha das cores certas pode aumentar as conversões em até 24%! Por exemplo, muitas pessoas acham que apresentar um botão de CTA vermelho em sua página de vendas gera mais vendas do que azul ou roxo. Da mesma forma, um anúncio de banner verde gerará resultados diferentes do que o mesmo anúncio com fundo amarelo ou vermelho.

Quais são os exemplos famosos de paleta de cores de sites?

Facebook

website-color-schemesimage42

Via G Hacks

Quando se pensa na plataforma de mídia social Facebook, é provável que uma cor venha à mente: azul! Na verdade, há um motivo interessante para isso: o fundador Mark Zuckerberg é daltônico para vermelho e verde. “O azul é a cor mais rica para mim; consigo ver todo o azul”, disse ele certa vez.

Embora isso possa não parecer uma explicação muito científica, essa decisão de cor moldou significativamente nossa percepção do Facebook. Muitos de nós o vemos como confiável, familiar e calmante - um lugar onde podemos ir para nos distrair do estresse do mundo.

eBay

website-color-schemesimage62

Via eBay

Embora o eBay tenha uma paleta de cores bastante ampla, o verde costuma aparecer com destaque em seu site. A loja de comércio eletrônico usa o simbolismo dessa cor para significar riqueza financeira (ou, nesse caso, economia de custos) e para inspirar os navegadores a clicar em “avançar” em suas compras.

Exemplos de esquemas de cores de sites para inspirar o seu próprio

Para que você comece a criar sua própria paleta, reunimos 50 belos sites com paleta de cores versáteis(abre em uma nova aba ou janela) nas quais você pode se inspirar.

Esquema de cores do site # 1: divertido e profissional

mark-dearman-fun-professional-website-color-palette

Mark Dearman

Essa paleta limpa e vibrante de Mark Dearman(abre em uma nova aba ou janela) combina perfeitamente cores de destaque quentes com um fundo azul limpo para criar uma paleta nítida e profissional, mas muito acolhedora. Tente usar cores que tenham um alto contraste entre si para obter o mesmo efeito limpo, porém marcante.

Esquema de cores do site # 2: tons Neon e contraste acentuado

website-color-schemesimage44

Play.agency

Este site da Play.agency adota uma abordagem ousada e de alto contraste, combinando um fundo escuro forte com cores de destaque em neon marcantes. Ao contrastar o preto com roxos, azuis e rosas, você pode criar um efeito igualmente impressionante.

Esquema de cores #3: Quente e ousado

website-color-schemesimage48

Lush Digital

Gostaria de misturar cores quentes e frias para criar uma vibração única? Siga a sugestão de design da Lush Digital(abre em uma nova aba ou janela), combinando vermelhos e azuis vibrantes com índigos e roxos mais escuros. Isso cria um efeito sonhador e ousado.

Por que começar do zero quando você pode usar o modelo de site de soluções dinâmicas de software em azul escuro e vermelho(abre em uma nova aba ou janela) do Canva para criar o visual na paleta de cores certa?

Esquema de cores do site #4: Limpo e destacado

website-color-schemesimage54

Essa paleta de cores da Departika(abre em uma nova aba ou janela) é limpa e profissional, graças aos azuis, cinzas e brancos suaves. No entanto, essa paleta também chama a atenção e destaca os elementos focais ao incluir uma cor vibrante na mistura. Quebre suas cores mais claras e suaves com um tom mais forte para obter um bom contraste.

Esquema de cores so site #5: Tons quentes

website-color-schemesimage51

Studio Recode

Este exemplo do Studio Recode(abre em uma nova aba ou janela) mantém as coisas limpas e minimalistas, mas com um toque mais quente. Usando tons quentes de marrom muito claro como cor de fundo neutra e compensando-os com os tons quentes nas imagens e na tipografia, essa paleta mantém as coisas convidativas e limpas.

Esquema de cores do site #6: Afiada e moderna

website-color-schemesimage58

Frost Festival

Uma ótima maneira de marcar seu site é dar a ele uma cor focal dominante, como visto neste exemplo do Frost Festival(abre em uma nova aba ou janela). Ao usar um verde marcante como cor focal e complementá-lo com toques de laranja claro, cinza e menta, essa paleta mantém as coisas frescas, modernas e simples.

Esquema de cores do site #7: Ousado e forte

website-color-schemesimage56

Magoz

Se as cores pastéis não forem muito do seu agrado, considere procurar cores brilhantes, fortes e vintage, como Magoz(abre em uma nova aba ou janela) fez neste exemplo. Embora esse exemplo use muitas cores de uma só vez, ele se mantém coeso e lógico com a consistência quente do esquema.

Esquema de cores do site #8: Inspirado em história da arte

website-color-schemesimage59

Fabrique

Em caso de dúvida, busque inspiração de cores em seu conteúdo. Este site do Museu Van Gogh, criado pela Fabrique(abre em uma nova aba ou janela), usa as cores vibrantes e texturizadas pelas quais suas obras são reconhecidas. Ao combinar amarelos quentes, azuis ricos e verdes frios, você obtém uma paleta simples e flexível com significado.

Faça uma analogia com o livro de Van Gogh com o site de negócios/publicidade Blue Grotto Pets and Animals do Canva

Esquema de cores do site #9: Tons e matizes

website-color-schemesimage63

Romain Bouchereau and Vincent Fréman

Uma ótima maneira de adicionar dimensão à sua paleta e, ao mesmo tempo, manter as coisas minimalistas é usar tons variados de uma cor. Essa paleta de cores limpa e elegante do site de Romain Bouchereau(abre em uma nova aba ou janela) e Vincent Fréman(abre em uma nova aba ou janela) faz exatamente isso ao usar tons ligeiramente diferentes de uma cor pêssego neutra que complementa a cor roxa focal.

Esquema de cores do site #10: Uma explosão de cores

website-color-schemesimage65

Magnium Themes

Este exemplo da Magnium Themes(abre em uma nova aba ou janela) injeta explosões de cores brilhantes na mistura para criar um efeito lúdico, mas elegante. O contraste de azuis, laranjas e amarelos com o fundo cinza neutro cria um efeito profissional, mas vibrante.

Esse esquema de cores é incorporado de forma mais sutil no modelo Waffle Blog Banner(abre em uma nova aba ou janela). Dê uma olhada no Canva hoje mesmo!

Esquema de cores do site #11: Elegante e sofisticado

website-color-schemesimage68

Julian Damy

Costumamos pensar em preto e branco como sendo as cores mais sofisticadas. Mas veja como este exemplo de Julian Damy(abre em uma nova aba ou janela) consegue obter um visual elegante simplesmente usando tons de azul profundo e sutis reflexos dourados. Outra paleta inspirada na história da arte, essa coleção de cores é atemporal e bonita.

Esquema de cores de site #12: Inspirado no verão

website-color-schemesimage70

StrADegy Advertising

Quando pensamos em designs de verão, tendemos a pensar em vermelhos e laranjas. Mas veja como este site da StrADegy Advertising consegue capturar o calor da estação apenas com cores corais, azuis e bronzeadas. O resultado é um esquema de cores simples, minimalista e fácil de usar, inspirado no verão.

Canalize essas vibrações frescas do verão no design do seu site com o modelo de banner Red Orange Abstract Modern Shapes do Canva(abre em uma nova aba ou janela).

Esquema de cores de site #13: Profissional e moderno

website-color-schemesimage24

Avondale Type Co.

Está procurando uma paleta de cores e site que seja profissional, mas que não seja chata ou desatualizada? Inspire-se nesta paleta da Avondale Type Co(abre em uma nova aba ou janela). A mistura de tons de cinza, azul-marinho profundo e amarelo marcante, combinada com o layout nítido, plano e moderno, cria um design autoritário, mas novo.

Esquema de cores site #14: Pretos arrojados e realces vibrantes

website-color-schemesimage26

Cantina dei Colli Ripani

Se você estiver procurando um design mais marcante e contemporâneo, tente incorporar toques ousados de preto e branco com algumas cores vibrantes, como neste exemplo da Cantina dei Colli Ripani(abre em uma nova aba ou janela). O contraste entre as cores destacadas e os pretos criam um efeito forte, ousado e divertido.

Esquema de cores de site #15: Gradientes limpos e azuis frescos

website-color-schemesimage28

SHIBUI

Você já viu um site e achou que ele parece “limpo”? Uma ótima maneira de obter essa estética é fazer o que a SHIBUI(abre em uma nova aba ou janela) fez aqui e usar gradientes. A paleta desse site é composta de cores azuis e turquesas frescas que foram desbotadas umas nas outras em um gradiente para obter um efeito calmo, limpo e fresco.

Esquema de cores de site #16: Alegre e elegante

website-color-schemesimage30

Huemor

Este site da Huemor(abre em uma nova aba ou janela) usa uma paleta de cores que é leve, moderna, alegre e acolhedora. Ao combinar cores vibrantes, muito espaço em branco e um azul frio e neutro para equilibrar o calor, ele é um excelente exemplo de como as cores podem fazer ou desfazer o design de um site.

Esquema de cores de site #17: Moderno e limpo

website-color-schemesimage32

Benedict Leicht

Este exemplo nítido e moderno de Benedict Leicht(abre em uma nova aba ou janela) usa diferentes tons de laranja e azul para criar uma paleta de cores divertida e enérgica. Ao usar tons brilhantes, tente equilibrá-los com alguns brancos mais neutros ou cinzas claros, como neste exemplo, para evitar que fiquem muito carregados.

Pronto para usar esse visual em seu próprio site? Confira o modelo Portfólio de ator de teatro(abre em uma nova aba ou janela) no Canva.

Esquema de cores de site #18: Luxuoso e moderno

website-color-schemesimage37

Zach Klein

Essa paleta de cores de Zach Klein(abre em uma nova aba ou janela) traz um mundo de luxo, sofisticação e personalidade ao design de seu site. Ao combinar azul-marinho, bronzeado quente e uma pitada de vermelho vivo, esse site se mantém moderno, minimalista e sofisticado.

Esquema de cores de site #19: Tons pastéis bonitos

website-color-schemesimage38

B/C Designers

As cores pastéis não são apenas para as paredes do quarto do bebê. Este site da B/C Designers(abre em uma nova aba ou janela) usa tons pastéis claros e brilhantes de rosa, azul e laranja para criar uma paleta divertida, brilhante e convidativa. Ao usar tons pastéis, tente misturar alguns espaços em branco para manter as coisas frescas e leves.

Quer brincar com tons pastéis bonitos no design do seu site? O modelo de banner de blog Bridal Shower Ideas(abre em uma nova aba ou janela) do Canva ajudará você a começar.

Esquema de cores de site #20: Único e marcante

website-color-schemesimage40

Great Works Copenhagen

Este site profissional da Great Works Copenhagen(abre em uma nova aba ou janela) adota uma abordagem menos neutra em relação às cores e, em vez disso, escolhe uma paleta vibrante. Ao combinar uma cor vermelha marcante com vários tons de azul e marinho, esse site equilibra um ar profissional com um toque exclusivo e divertido.

Esquema de cores de site #21: Combinações de cores inesperadas

website-color-schemesimage11

Intesys S.r.l.

Roxo e verde não são duas cores que se misturam com frequência, mas este site da Intesys S.r.l.(abre em uma nova aba ou janela) prova que talvez devessem ser! A rica cor roxa contrasta de forma impressionante com o limão vibrante e os brancos nítidos para criar um design de site exclusivo e memorável.

Esquema de cores de site #22: Inspiração retrô

website-color-schemesimage12

Lowdi

Essa paleta de cores da Lowdi(abre em uma nova aba ou janela) canaliza todas as coisas vintage usando cores quentes e ricas. Essa paleta de cores de inspiração retrô tem muita personalidade e energia com um toque decididamente moderno. Considere usar uma cor amarela muito clara no lugar do branco para ajudar a aprimorar esse efeito.

Esquema de cores de site #23: Antigo e clean

website-color-schemesimage13

Pier-Luc

O esquema de cores do site de Pier-Luc(abre em uma nova aba ou janela) apresenta uma combinação elegante de vermelho-terra, verde fresco e cinza claro. Ao combinar essa paleta suave com uma imagem de cores suaves, esse design de site consegue evocar sofisticação e um charme antigo.

Esquema de cores de site #24: Impressionante e enérgico

website-color-schemesimage14

Hyperakt

O site de infográfico interativo da Atlassian(abre em uma nova aba ou janela) criado pela Hyperakt(abre em uma nova aba ou janela) usa cores fortes e altamente saturadas e as sobrepõe de forma a criar um efeito impressionante. Você também notará que as cores marcantes são equilibradas com uma cor branca neutra e agradável. Esse é um ótimo lembrete da importância de manter seu esquema de cores harmonioso.

Esquema de cores de site #25: Fresco e vivo

website-color-schemesimage15

Baesman

Este site da Baesman(abre em uma nova aba ou janela) é mais um exemplo de como cores brilhantes e vibrantes ainda podem ser usadas para criar um design profissional. Usando cores claras e limpas e equilibrando-as com espaço em branco e um design minimalista, esse site mantém uma vibração divertida e vibrante sem sacrificar a elegância de um site profissional.

Esquema de cores de site #26: Limpo e nítido

website-color-schemesimage16

BrightMedia

Este exemplo da BrightMedia(abre em uma nova aba ou janela) é um exemplo de uma paleta de cores limpa, fresca e flexível. Ao combinar diferentes tons de azul com alguns tons de cinza, essa paleta é minimalista e simples sem ser monótona ou entediante.

Esquema de cores de site #27: Colorido sem chocar

website-color-schemesimage17

Yoke

Às vezes, o uso de muitas cores conflitantes pode ser esmagador e chocante. Mas, no caso deste site da Yoke(abre em uma nova aba ou janela), o uso de uma paleta brilhante e completa funciona sem problemas. Ao suavizar um pouco cada cor e incluir muito espaço em branco no design, você também pode criar um efeito vibrante, mas não exagerado.

Esquema de cores de site #28: Suave e minimalista

website-color-schemesimage18

Inga Gudonien / MIOS

Este exemplo de Inga Gudoniene / MIOS(abre em uma nova aba ou janela) combina cores mais suaves e discretas para criar um visual elegante. Você pode obter esse efeito atemporal e elegante escolhendo imagens com um tom frio e dessaturado e combinando-as com um cinza frio.

Esquema de cores de site #29: Fresco e calmo

website-color-schemesimage19

Roll Studio

Se estiver procurando criar um ambiente descontraído e praiano em seu site, considere seguir o exemplo do Roll Studio(abre em uma nova aba ou janela). Ele combina turquesas, roxos e um toque de laranja para criar uma paleta de cores calma, convidativa e exclusiva.

Esquema de cores de site #30: Moderno e silencioso

website-color-schemesimage1

Relax, we are the good guys

A paleta do site da Brdr. Krüger(abre em uma nova aba ou janela), criada pela Relax, we are the good guys(abre em uma nova aba ou janela), dá vida a esse design de site simplesmente combinando algumas cores suaves e claras. Como cada cor é um tom suave e consistente em uma tonalidade diferente, elas trabalham juntas para criar uma paleta calma, porém moderna, com muita personalidade.

Esquema de cores de site #31: Natural e fresco

website-color-schemesimage2

AQuest

O esquema de cores deste site da Apparecchiato(abre em uma nova aba ou janela) by AQuest(abre em uma nova aba ou janela) se inspira nos tons terrosos dos vegetais para criar uma paleta limpa e fresca. Basta usar folhas verdes, vermelhos profundos e roxos ricos ao lado de algum espaço em branco para reproduzir esse efeito.

Esquema de cores de site #32: Alta saturação e alta energia

website-color-schemesimage3

El Burro

Essa paleta para o El Burro(abre em uma nova aba ou janela) é um grito de diversão, energia e entusiasmo. Ao usar cores altamente saturadas, como rosa choque, limão, ciano e amarelo, você pode replicar esse efeito e criar um design que seja vigoroso e jovial.

Esquema de cores de site #33: Quente e maravilhoso

website-color-schemesimage4

Fieldwork

Procurando uma paleta que possa acomodar designs um pouco mais complexos? Dê uma olhada nesta para a Fieldwork(abre em uma nova aba ou janela), que usa apenas cinco cores, mas consegue mantê-la complexa e colorida. Ao misturar um ciano marcante com amarelos quentes, vermelhos e alguns marinhos mais profundos, você pode obter uma paleta divertida, envolvente e flexível.

Esquema de cores de site #34: Charme vintage

website-color-schemesimage5

Cafe Frida

Deseja criar um efeito vintage que não pareça datado ou antiquado? Confira esta paleta do Cafe Frida(abre em uma nova aba ou janela) que usa dourados, verdes, marrons e brancos quentes para criar um efeito charmoso que exala classe.

Gostou do que viu? Confira o modelo Nordic Tree Background Fall(abre em uma nova aba ou janela) do Canva para obter uma aparência semelhante em seu próprio design.

Esquema de cores de site #35: Tons frios de joias

website-color-schemesimage7

GrowCreate

Este site Business Benchmark on Farm Animal Welfare da GrowCreate usa belos tons de roxo e azul com gradientes sutis para criar uma paleta de cores simples, mas atraente. O toque ocasional de rosa choque mantém o design envolvente, fresco e atraente.

Esquema de cores de site #36: Tons tempestuosos

website-color-schemesimage8

Cinco Design

Procurando um visual mais escuro e elegante, mas não é fã do preto puro? Dê uma olhada neste design de site tempestuoso e temperamental da Cinco Design(abre em uma nova aba ou janela), que usa roxos profundos, azuis e rosas para criar um efeito elegante e sofisticado.

Esquema de cores de site #37: Quente vs. frio

website-color-schemesimage9

Cinco Design

Ao combinar tons quentes com tons mais frios, você pode criar uma paleta forte e persuasiva. Este exemplo da Akaru(abre em uma nova aba ou janela) contrasta laranjas e amarelos quentes com cinzas metálicos frios e tons de bronze para criar um efeito ousado e dinâmico.

Incorpore perfeitamente esse esquema de cores frias e quentes em seu próprio site com o modelo de site Amarelo para empresas de contabilidade/publicidade(abre em uma nova aba ou janela) do Canva.

Esquema de cores de site #38: Limpo e escolar

website-color-schemesimage47

details.ch

Deseja uma paleta profissional e personalizada com um toque de cor? Dê uma olhada nesta paleta elegante da details.ch(abre em uma nova aba ou janela) que usa tons nítidos, limpos e elegantes para criar um esquema de cores simples. Não tenha medo de jogar uma pitada de rosa entre os azuis para dar um toque exclusivo.

Esquema de cores de site #39: Simples e fresco

website-color-schemesimage49

MadeByShape

Essa paleta da MadeByShape(abre em uma nova aba ou janela) usa uma mistura não convencional de cores, mas as combina de forma muito natural. As cores cinza-carvão, salmão, azul-petróleo profundo, menta claro e bege neutro formam uma combinação única, mas bonita.

Esquema de cores de site #40: Tons tropicais

website-color-schemesimage50

Thomas Schrijer

Este belo design de site para o Top 10 de 2014 de Thomas Schrijer(abre em uma nova aba ou janela) usa tons tropicais vibrantes para criar um belo efeito. O uso de amarelos, vermelhos, verdes e azuis quentes cria uma paleta divertida, fácil e bonita, adequada a qualquer marca enérgica.

Esquema de cores de site #41: Cores arrojadas

website-color-schemesimage53

Joy Intermedia

Uma ótima maneira de evitar que sua paleta de cores pareça muito unidimensional é adicionar uma cor ousada entre os tons mais neutros e suaves. Dê uma olhada neste projeto da Joy Intermedia(abre em uma nova aba ou janela), que usa uma base de cinzas, carvão e azul-marinho escuro, mas apimenta-o com um toque de cerise.

Website color scheme #42: Tons antigos

website-color-schemesimage55

Leibowitz Branding & Design

O site da Athena Art Finance(abre em uma nova aba ou janela), criado pela Leibowitz Branding & Design(abre em uma nova aba ou janela), usa belos tons antigos para criar um design elegante e sofisticado com muito charme. Ao se inspirar na história da arte e usar roxos profundos, azuis, verdes e dourados quentes, você pode transformar qualquer página da Web em um lugar sofisticado e deslumbrante.

Esquema de cores de site #43: Neon e ousado

website-color-schemesimage57

Calvi on the Rocks

Este exemplo da Calvi on the Rocks(abre em uma nova aba ou janela) nos mostra exatamente como usar artisticamente os tons vibrantes de neon, equilibrando-os. Essa paleta é composta por um verde marcante, um roxo vibrante e uma pitada de azul royal, mas equilibra essa vibração com uma grande quantidade de off-white neutro para não sobrecarregá-la.

Esquema de cores de site #44: Tons silenciosos

website-color-schemesimage60

The Martin Agency

Este impressionante design de site da The Martin Agency(abre em uma nova aba ou janela) usa tons suaves de dourado e esbranquiçado em contraste com pretos e brancos mais nítidos para criar um contraste impressionante. Simples, minimalista e elegante, essa paleta é perfeita para qualquer projeto sofisticado que você venha a desenvolver.

Esquema de cores de site #45: Simples mas ousado

website-color-schemesimage64

Mambo Mambo

Deseja a facilidade de uma paleta pequena, mas com a vibração de uma paleta grande? Dê uma olhada nesta da Mambo Mambo(abre em uma nova aba ou janela) que usa amarelo e alguns tons de verde/azul para formar uma paletade cores de site simples, porém elegante. Esse esquema de cores é tropical, divertido, fresco e, o melhor de tudo, fácil!

Esquema de cores de site #46: Corporativo e elegante

website-color-schemesimage66

Ryan Borker, Jermaine Craig, Mike Parsons, and Kyle Miller

Precisa de um toque menos vibrante e um pouco mais de profissionalismo? Inspire-se nas belas cores usadas nessa paleta por Ryan Borker(abre em uma nova aba ou janela), Jermaine Craig(abre em uma nova aba ou janela), Mike Parsons e Kyle Miller(abre em uma nova aba ou janela). A ousada cor de destaque azul-marinho é lindamente combinada com o fundo off-white casca de ovo para criar um design de site simples e elegante.

Deseja canalizar essa estética profissional em seu próprio site? Crie seu próprio modelo de anúncio do Facebook para Design de interiores moderno(abre em uma nova aba ou janela) no Canva.

Esquema de cores de site #47: Moderno e minimalista

website-color-schemesimage20

Huemor

Essa paleta de cores de site da Huemor(abre em uma nova aba ou janela) mantém as coisas muito simples e minimalistas, usando uma paleta de cores predominantemente monocromática e equilibrando-a com alguns toques de laranja para chamar a atenção. Ao fazer isso, ela destaca recursos importantes e dá personalidade a esse design que, de outra forma, seria monocromático.

Esquema de cores de site #48: Divertido e alegre

website-color-schemesimage21

Marie Catribs

As cores acrescentam personalidade ao seu design, como você pode ver neste exemplo de Marie Catribs(abre em uma nova aba ou janela). Os azuis brilhantes, os roxos e os amarelos ajudam a dar vida à natureza divertida e peculiar desse design.

Esquema de cores de site #49: Ensolarado e calmo

website-color-schemesimage23

TRAFFIC

Está querendo criar um site acolhedor e convidativo? Faça experiências com tons quentes, como a TRAFFIC(abre em uma nova aba ou janela) fez aqui. Usando amarelos e dourados quentes e equilibrando-os com tons marinhos profundos, cria-se uma paleta calma, pacífica e convidativa.

Esquema de cores de site #50: Pop art

website-color-schemesimage25

Visualsoft

Sua marca é jovem? Energética? Divertida? Mostre isso usando toques de cores brilhantes e vibrantes como o Visualsoft(abre em uma nova aba ou janela). Os toques de rosa neon, amarelo e azul em meio a um design elegante e minimalista fazem com que o design desse site exploda de personalidade.

Como escolher a paleta de cores de seu próprio site

Então, como criar sua própria paleta de cores do zero(abre em uma nova aba ou janela)? Aqui estão algumas dicas para orientá-lo no processo.

Use a ajuda de um círculo cromático

Você não precisa reinventar a roda ao escolher as cores para a sua marca - basta usar a nossa! O círculo cromático do Canva(abre em uma nova aba ou janela) é uma ferramenta útil usada na teoria das cores para determinar quais tons ficam atraentes juntos. Existem dois tipos de círculos de cores: o RYB e o RGB. O primeiro é o círculo cromático vermelho, amarelo e azul, que geralmente é usado por artistas para combinar cores de tinta. Depois, há o círculo cromático vermelho, verde e azul, que é usado por designers gráficos, pois envolve a mistura de luz para uso online.

O círculo cromático do Canva usa cores RGB e permite que você veja quais combinações de cores(abre em uma nova aba ou janela) funcionam bem juntas com base na teoria das cores(abre em uma nova aba ou janela). Quando encontrar uma que lhe agrade, você poderá começar a trabalhar em um gráfico com esse esquema de cores ou exportar sua paleta para referência posterior.

website-color-schemesimage27

Considere o perfil demográfico

Existem alguns esquemas de cores de sites(abre em uma nova aba ou janela) que têm apelo universal (ou o oposto!) para a maioria das pessoas. Por exemplo, a maioria das pessoas provavelmente pensaria que rosa e marrom é uma combinação chocante, enquanto rosa e azul é geralmente inofensivo.

Entretanto, no final das contas, a percepção das cores não é uma experiência única para todos. Pessoas diferentes percebem as cores de maneiras diferentes, dependendo de sua idade, cultura e experiências de vida.

Por esse motivo, é extremamente importante ter em mente seu público-alvo ao escolher o esquema de cores do seu site. Tente se colocar no lugar deles e imaginar que tipo de associações e sentimentos a combinação de cores pode evocar para eles.

website-color-schemesimage29

Design de conceito de site para um aplicativo infantil criado por Daniel. Imagem via Dribbble.

Por exemplo, esse conceito para um aplicativo infantil tem dois públicos-alvo principais: crianças pequenas e seus pais. O designer selecionou seu esquema de cores de acordo com isso, usando um fundo azul claro para invocar sentimentos de segurança e serenidade que provavelmente atrairão os pais. No entanto, eles combinaram isso com elementos azuis e laranja mais brilhantes para dar ao design uma estética mais divertida e jovem.

Está projetando algo para um público mais jovem(abre em uma nova aba ou janela)? O modelo de site para pequenas empresas de cuidados com animais de estimação rosa e azul do Canva tem uma estética divertida e fresca que pode ser facilmente reaproveitada para sua própria marca.

Crie uma paleta de cores

Desde os botões e o rodapé até o formulário pop-up, há muitos elementos visuais diferentes a serem considerados ao criar um site. É por isso que é tão importante ter uma paleta de cores para o site(abre em uma nova aba ou janela) à sua disposição para escolher como achar melhor. Em geral, o esquema de cores de um site terá de quatro a cinco tons diferentes, desde as cores principais da marca até as secundárias, mais neutras.

website-color-schemesimage33

Pharrell William's website is colorful and dynamic

O site do Pharrell William permite que os visitantes criem um cartão que represente seu projeto favorito. Cada projeto é representado por uma cor de uma paleta criada especificamente e, em seguida, apresentado em tamanhos variados. Você não precisa usar tantas cores quanto uma, mas é uma boa ideia ter algumas para escolher. Em vez de uma paleta diversificada, você também pode optar por usar cores semelhantes em tons e saturações ligeiramente diferentes - tudo depende da personalidade, dos dados demográficos e das necessidades de sua marca.

Como usar uma paleta de cores de um kit de marca

Sua paleta de cores será uma ferramenta indispensável em seu kit de marca(abre em uma nova aba ou janela), que é essencialmente sua bíblia de design gráfico. Esse é um recurso que você cria ao criar a identidade visual da sua marca(abre em uma nova aba ou janela) e também inclui suas fontes, estilos de imagem e logotipo.

website-color-schemesimage35

ThisThatApp Assets by Helena. Image via Dribbble.

A maioria dos kits de marca terá uma seção dedicada à sua paleta de cores(abre em uma nova aba ou janela), na qual você identifica as cores da sua marca e os códigos correspondentes. Eles podem incluir os códigos Pantone (cor especializada) e CMYK (cores de impressão padrão), mas para o web design, você precisa principalmente dos códigos RGB e HEX (hexadecimal). Dependendo da estética da sua marca, você também pode incluir diferentes matizes e tons das mesmas cores.

Ter sua paleta de cores facilmente acessível em seu kit de marca garantirá que você obtenha a correspondência exata de cores sempre que estiver projetando algo novo para sua marca. O recurso Brand Kit do Canva Pro permite que você defina a cor e os códigos da sua marca(abre em uma nova aba ou janela) para facilitar o acesso quando estiver criando no aplicativo(abre em uma nova aba ou janela).

Seja com cores fortes e brilhantes(abre em uma nova aba ou janela) ou suaves e calmas, usar um esquema de cores apropriado é a melhor maneira de garantir que a impressão seja positiva. Usando as dicas e a inspiração deste artigo, você pode criar uma paleta de cores de site que dê vida à personalidade exclusiva de sua marca.

Dê vida às suas ideias em questão de minutos.

Expresse-se melhor com o programa de design mais fácil do mundo.