# Ideias de cores para marca: 30 paletas para marcas novas, com códigos

[Canonical HTML page](https://gradiently.design/pt-br/guide/brand-color-ideas)

Uma paleta de marca são quatro ou cinco cores com funções, não uma cor favorita e algumas amigas. Aqui estão 30 pontos de partida por clima e por segmento, com códigos para copiar e um jeito de testá-los.

## The short version

- Uma paleta de marca que funciona tem quatro ou cinco cores com funções fixas: um fundo, uma cor principal, um tom de apoio, um neutro para o texto e um acento.
- O acento é a cor de que as pessoas se lembram, então ele deve aparecer em uma coisa por vez, como um botão, um preço ou o símbolo do logo.
- Paletas que combinam com um segmento ajudam o cliente a entender o que você vende, mas é uma única cor inesperada que torna uma marca reconhecível.
- Teste uma paleta em designs reais, em tamanhos reais, no claro e no escuro, antes de decidir, porque amostras numa página branca escondem a maioria dos problemas.
- Confira se a cor do texto sobre o fundo atende ao contraste WCAG, senão o texto corrido vai ser difícil de ler para muita gente.

Boas **ideias de cores para marca** começam pelas funções, não pelas favoritas. Escolha uma cor de fundo sobre a qual a maioria dos seus designs vai ficar, uma cor principal que diga que tipo de negócio você é, um tom de apoio para dar profundidade, um neutro para o texto e um acento pelo qual as pessoas vão lembrar de você. Abaixo estão 30 paletas montadas assim, seis por clima com amostras e 24 por segmento com códigos, mais um método rápido para testar a que você escolher.

## Como uma paleta de cores de marca é montada

A maioria das paletas que falham são cinco cores com o mesmo peso: nenhuma lidera, então nenhuma é reconhecível. Uma paleta funciona quando cada cor tem uma parte do espaço: o fundo cobre quase tudo, a cor principal uma boa parte e o acento só uma lasca. A [regra 60 30 10](https://gradiently.design/pt-br/guide/60-30-10-rule) é uma proporção inicial útil, mesmo que você a dobre depois.

| Função | Parte do design | Tarefa |
| --- | --- | --- |
| Fundo | Cerca de 60% | Fundos, áreas grandes, o clima |
| Principal | Cerca de 25% | Títulos, formas, a cor que as pessoas associam a você |
| Apoio | Cerca de 5 a 10% | Profundidade, painéis secundários, ilustrações |
| Neutra | Só texto | Texto corrido que precisa ser lido sobre o fundo |
| Acento | Menos de 5% | Um botão, um preço, um símbolo por design |

Cinco funções, cinco proporções. O acento funciona porque é raro; espalhe por toda parte e ele vira uma segunda cor principal.

## Paletas de cores de marca por clima

Comece por aqui se você sabe como quer que as pessoas se sintam. As associações de cor são culturais, não universais, como explica a [psicologia das cores](https://gradiently.design/pt-br/guide/color-psychology).

- Marinho profundo: #0b2545
- Porto: #13315c
- Azul névoa: #8da9c4
- Sálvia pálida: #eef4ed
- Latão: #e0a458

1. Calma e confiável. O marinho passa firmeza; um acento de latão evita que pareça um extrato bancário. Combina com finanças, saúde e consultorias.

- Espresso: #3d2314
- Terracota: #c8553d
- Damasco: #f28f3b
- Creme: #f6e7cb
- Verde-sálvia azulado: #588b8b

2. Quente e simpática. Vermelhos terrosos sobre creme parecem feitos à mão. O acento frio de verde-sálvia azulado evita que pareça mais um café igual aos outros.

- Floresta: #1b3a2f
- Musgo: #4f772d
- Samambaia: #90a955
- Lima suave: #ecf39e
- Giz: #fdfcf6

3. Fresca e natural. Verdes do profundo ao vivo, sobre giz, para marcas de bem-estar e sustentabilidade.

- Tinta: #0d0d1a
- Ultramar: #3a0ca3
- Violeta: #7209b7
- Rosa choque: #f72585
- Céu elétrico: #4cc9f0

4. Ousada e moderna. Um fundo quase preto deixa a cor saturada brilhar. Use o céu elétrico com moderação.

- Preto suave: #1a1a1a
- Úmbria: #4a3f35
- Ouro antigo: #b08d57
- Linho: #e8dcc8
- Marfim: #f7f3ee

5. Luxo discreto. Pouca saturação e muito espaço. O dourado só parece caro quando é apagado e usado com moderação.

- Tinta: #2b2d42
- Vermelho coral: #ff6b6b
- Girassol: #ffd93d
- Folha: #6bcb77
- Azul piscina: #4d96ff

6. Divertida. Quatro cores vibrantes seguradas por uma tinta escura. Deixe uma cor liderar em cada design.

## Ideias de cores para marca por segmento

Cada paleta por segmento lista quatro códigos, normalmente do mais escuro para o mais claro, e a última coluna diz qual cor faz o papel de acento. As convenções existem por um motivo: um dentista em verde-azulado e uma padaria em marrons quentes são entendidos de relance. Siga a convenção com a cor principal e quebre-a com delicadeza no acento.

| Negócio | Paleta | Códigos | Por que funciona |
| --- | --- | --- | --- |
| Contador | Livro-caixa | `#1d3557` `#457b9d` `#f1faee` `#e63946` | Marinho para confiança, um acento vermelho reservado ao número que importa |
| Escritório de advocacia | Gabinete | `#2b2d42` `#8d99ae` `#edf2f4` `#9c6644` | Ardósia e papel com um acento marrom couro |
| Dentista | Sorriso limpo | `#03363d` `#17a398` `#e6f4f1` `#ffb703` | O verde-azulado parece clínico sem ser frio; o amarelo é simpático |
| Clínica de fisioterapia | Recuperação | `#264653` `#2a9d8f` `#e9f5f2` `#f4a261` | Verdes-azulados calmos com um acento quente e encorajador |
| Café | Torra da manhã | `#4a2c2a` `#c08552` `#f3e9dc` `#5e8b7e` | Marrons de café com um verde inesperado |
| Padaria | Crumb | `#7f4f24` `#dda15e` `#fefae0` `#bc4749` | Casca, manteiga e farinha, com um vermelho geleia para as ofertas |
| Restaurante noturno | Clube do jantar | `#1b1b1e` `#7a1e2c` `#d4a373` `#f5ebe0` | Fundo escuro e vermelho vinho lembram jantar, com um acento caramelo |
| Floricultura | Haste | `#2d4a3e` `#e5989b` `#ffcdb2` `#fffaf5` | O verde-folha profundo faz o acento rosa suave parecer fresco |
| Estúdio de yoga | Respiro | `#5e548e` `#9f86c0` `#e0b1cb` `#fbf8f3` | Violetas crepusculares que desaceleram o olhar, com rosa como acento |
| Academia | Repetição | `#111111` `#3a3a3a` `#f2f2f2` `#e4ff1a` | Preto e cinza com um amarelo ácido bem barulhento |
| Skincare | Orvalho | `#6b4e3d` `#e8b4a0` `#f6e3d8` `#fdf8f4` | Tons de pele e brancos quentes, marrom cacau para o texto, pêssego como acento |
| Marca de moda | Ateliê | `#0f0f0f` `#c9c1b6` `#f4f1ec` `#8a1c1c` | Preto e pedra com um único vermelho sangue de boi |
| Joalheria | Veludo | `#14213d` `#2e1a47` `#f5f0e6` `#c9a227` | Azuis meia-noite realçam um acento dourado como faz uma vitrine |
| Imobiliária | Porta da frente | `#22333b` `#5e503f` `#eae0d5` `#c6ac8f` | Carvão e tons de madeira lembram uma casa bem cuidada; areia é o acento |
| Escritório de arquitetura | Concreto | `#262626` `#7d7d7d` `#d9d9d9` `#ff5a1f` | Cinzas como materiais, um laranja de segurança |
| Ferramenta para desenvolvedores | Terminal | `#0b1021` `#1f6feb` `#e6edf3` `#7ee787` | Azuis escuros de interface com um acento verde código |
| Fintech | Livro-caixa menta | `#0a2e2a` `#00b37e` `#d7f9ec` `#1e1e24` | Verde profundo com um acento menta vivo sinaliza dinheiro sem clichês de cifrão |
| Produto de IA | Sinal | `#0e0b16` `#5b5bd6` `#a78bfa` `#f0abfc` | Índigo sobre quase preto, com orquídea como acento contido |
| Podcast | No ar | `#1a1423` `#ff7b54` `#ffb26b` `#ffd56b` | Um fundo escuro de estúdio com uma rampa quente de pôr do sol, com o coral na frente |
| Marca infantil | Parquinho | `#118ab2` `#06d6a0` `#ffd166` `#ef476f` | Cores vivas e limpas, suavizadas na medida; o rosa é o acento |
| ONG | Terreno comum | `#2f3e46` `#52796f` `#cad2c5` `#f4a259` | Verdes sóbrios com um laranja esperançoso |
| Equipamento outdoor | Início da trilha | `#283618` `#606c38` `#fefae0` `#dd6b20` | Oliva e lona com um laranja de alta visibilidade |
| Assessoria de casamento | Votos | `#6d597a` `#b56576` `#e8c2ca` `#fbf6f0` | Ameixa com um acento rosa que fica bonito no papel |
| Artista musical | After | `#090014` `#3c096c` `#ff006e` `#fb5607` | A escuridão da balada com dois acentos quentes e conectados |

Copie os códigos para o seu [kit de marca](https://gradiently.design/pt-br/guide/brand-kit) e ajuste uma cor até ela parecer sua.

## Como fazer uma paleta parecer a sua marca

O que transforma uma paleta de lista numa identidade é uma decisão que ninguém mais da sua rua tomou, normalmente o acento: um escritório de advocacia em marrom couro, uma academia em amarelo ácido. Mude o acento primeiro e mantenha o fundo e a cor do texto, assim você ganha um visual sem perder legibilidade.

### Evite

- Cinco cores vibrantes usadas por igual
- Escolher primeiro a cor do logo e o resto no olho
- Um acento em todos os elementos de todos os designs
- Texto cinza-claro sobre fundo creme
- Escolher a partir de amostras numa página branca

### Faça

- Um fundo que cobre a maior parte do espaço
- Funções primeiro, depois as cores para preenchê-las
- Uma coisa com acento por design
- Um neutro escuro que passa no contraste
- Testar num post, num story e num banner reais

Uma paleta misturada num degradê suave dá a você um fundo inconfundivelmente seu, desde que as cores sejam aparentadas.

- Respiro como degradê: `linear-gradient(160deg, #5e548e 0%, #9f86c0 50%, #e0b1cb 100%)`
- Marinho calmo como degradê: `linear-gradient(160deg, #0b2545 0%, #13315c 55%, #8da9c4 100%)`
- Brilho quente de terracota: `radial-gradient(circle at 80% 20%, #f28f3b 0%, #c8553d 40%, #3d2314 85%)`

Três das paletas acima como fundos. Cores vizinhas se misturam de forma limpa; deixe o acento fora da mistura e use-o por cima.

## Teste as cores da sua marca antes de decidir

1. **Faça três designs reais** Um post quadrado, um story de 1080×1920 e um cabeçalho de 1500×500, com palavras reais e o seu logo.
2. **Confira o contraste do texto** O seu neutro sobre o seu fundo deve passar no WCAG AA. [Contraste de cores e acessibilidade](https://gradiently.design/pt-br/guide/color-contrast-accessibility) mostra como medir.
3. **Olhe em tamanho pequeno** Reduza o post ao tamanho de uma miniatura. Se ainda dá para saber que é seu, a paleta está cumprindo o papel.
4. **Compare com concorrentes** Coloque o seu post ao lado de três concorrentes locais. Se o seu se perde, mude o acento, não a paleta inteira.
5. **Anote os códigos** Registre cada código hex e sua função num só lugar.

Um post vertical de padaria dizendo Pão fresquinho a partir das sete sobre um fundo degradê quente

Testando uma paleta num post de verdade: o título, o detalhe e o fundo precisam funcionar juntos em 1080×1350.

Se você quer ajuda para escolher, [como escolher as cores da marca](https://gradiently.design/pt-br/guide/how-to-choose-brand-colors) percorre a decisão do zero, e [combinações de cores para logo](https://gradiently.design/pt-br/guide/color-combinations-for-logos) reduz a escolha às duas ou três cores que o próprio símbolo deve usar.

## Como transformar as cores da marca num visual

Cinco códigos hex podem ser copiados por qualquer um. No Gradiently, um Mark leva uma paleta como um fundo vivo, com luz, grão e movimento próprios, e não existem dois Marks iguais. Busque no Mercado com palavras de cor como “verde-azulado profundo” para achar um próximo da sua paleta, crie com ele de graça e reserve-o para que só você possa exportar com ele. O seu kit de marca guarda os códigos exatos para texto e acentos.

## FAQ

### Quantas cores uma marca deve ter?

Quatro ou cinco bastam para a maioria das marcas: um fundo, uma cor principal, um tom de apoio, um neutro para o texto e um acento. Mais do que isso fica difícil de usar com consistência.

### Qual é a melhor cor para uma marca nova?

Não existe uma melhor cor. Escolha uma cor principal que combine com o que você vende e depois um acento que seus concorrentes não usam, para que os clientes consigam identificar você.

### As cores da minha marca devem combinar com o meu segmento?

Seguir o segmento com a cor principal ajuda as pessoas a entenderem você rápido. Quebrar a convenção com o acento é o que torna você memorável.

### Como verificar se as cores da minha marca são acessíveis?

Meça o contraste da cor do texto sobre o fundo com um verificador de contraste WCAG. Texto corrido deve chegar a pelo menos 4,5:1.

### Posso usar um degradê como cor de marca?

Sim, desde que seja feito com cores aparentadas da sua paleta e que você mantenha uma versão chapada para usos pequenos, como favicons e texto.