# Branding com gradiente: como ter uma identidade só sua

[Canonical HTML page](https://gradiently.design/pt-br/guide/gradient-branding)

Gradientes estão em toda parte, e esse é justamente o problema. Veja como transformar um em uma identidade que as pessoas reconhecem, e não em um fundo que qualquer um poderia usar.

## The short version

- Branding com gradiente é usar uma mistura específica de cores como parte central e reconhecível de uma marca, do mesmo modo que outras marcas usam uma única cor.
- Um gradiente só funciona como branding quando é consistente: as mesmas cores, direção, textura e comportamento em todo lugar onde a marca aparece.
- Gradientes populares são compartilhados por milhares de marcas, então um gradiente montado a partir de um preset raramente se torna reconhecível sozinho.
- As identidades em gradiente mais fortes acrescentam algo mais difícil de copiar que a cor: um material, uma textura, um jeito de se mover ou de abrir espaço para as palavras.
- Toda identidade em gradiente precisa de uma cor lisa de reserva para tamanhos pequenos, impressão em uma cor e lugares onde gradientes não renderizam.

**Branding com gradiente** é usar uma mistura específica de cores como parte central do modo como as pessoas reconhecem você, do jeito que outra marca poderia ser dona de um único vermelho. Bem feito, o gradiente vira uma assinatura: as pessoas veem o canto de um post ou uma faixa de um cabeçalho e sabem de quem é antes de ler qualquer palavra. Mal feito, vira um fundo agradável que poderia ser de qualquer um, porque já é.

Este guia explica por que os gradientes viraram assinaturas de marca, por que a maioria não consegue ser reconhecida e os passos práticos para construir um que você possa chamar de seu. Se o assunto é novo para você, comece por [o que é um gradiente](https://gradiently.design/pt-br/guide/what-is-a-gradient) e pelos [tipos de gradiente](https://gradiently.design/pt-br/guide/types-of-gradients).

## Por que as marcas passaram da cor lisa para os gradientes

O design chapado dominou as telas por anos porque era limpo, rápido e fácil de manter consistente. Mas a cor lisa tem um teto: há um número limitado de matizes distinguíveis, e a maioria das categorias já tem uma cor que todo mundo usa. O gradiente multiplica as opções. Duas ou três cores, uma direção e uma textura dão um espaço de combinações grande o bastante para achar algo distintivo.

Gradientes também parecem vivos nas telas. Uma mistura sugere luz, profundidade e movimento de um modo que uma cor única não consegue, e é por isso que aparecem tanto em ícones de apps, páginas de lançamento e filmes de produto.

Um post vertical de rede social com o título Aberto até tarde às sextas sobre um gradiente escuro e luminoso

Uma identidade em gradiente em um post do feed…

Um story vertical anunciando um novo cardápio sobre o mesmo gradiente do post ao lado

…e em um story. O mesmo material, outra função.

## Por que a maior parte do branding com gradiente não é reconhecível

O que tornou os gradientes fáceis também os tornou comuns. As ferramentas de design trazem os mesmos presets, os geradores sugerem os mesmos pares e as tendências empurram todo mundo para a mesma mistura de roxo e rosa ou de azul e turquesa ao mesmo tempo. Quando milhares de marcas partem das mesmas poucas centenas de gradientes, esses gradientes deixam de pertencer a alguém.

- Violeta para rosa: `linear-gradient(135deg, #7f5af0 0%, #ff6ac1 100%)`
- Azul para ciano: `linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)`
- Orquídea para coral: `linear-gradient(135deg, #f093fb 0%, #f5576c 100%)`
- Verde para água: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`

Misturas de duas cores que todo mundo já viu. Todas são bonitas, e todas são usadas por tantas marcas que nenhuma diz quem é você.

Há uma segunda armadilha: a inconsistência. Uma marca usa um gradiente no site, outro um pouco diferente nas redes e um terceiro nos slides porque alguém o refez de memória. O reconhecimento vem da repetição, e a repetição exige que o gradiente seja o mesmo sempre. Nosso guia de [consistência de marca](https://gradiently.design/pt-br/guide/brand-consistency) aprofunda o porquê.

## O que faz um gradiente poder ser só seu

A cor sozinha é fácil de emprestar. O que torna uma identidade em gradiente difícil de copiar é tudo o que cerca a cor. Pense em uma identidade em gradiente como uma receita, e não como uma amostra.

| Ingrediente | O que faz | Dificuldade de copiar |
| --- | --- | --- |
| Cores | A primeira coisa que as pessoas notam | Fácil: qualquer um pode coletar um código hex |
| Direção e estrutura | Campos lineares, radiais, em malha ou fluidos | De fácil a moderada |
| Material e textura | Grão, seda, vidro, papel, luz | Difícil: está no comportamento da superfície |
| Movimento | Como a cor deriva ou flui | Difícil: exige o mesmo sistema para reproduzir |
| Comportamento com as palavras | Como o campo abre espaço para o texto | Muito difícil sem o mesmo sistema |

Quanto mais abaixo na lista, mais o gradiente se torna seu.

Esse é o raciocínio por trás dos ativos de marca distintivos: os elementos que provocam reconhecimento sozinhos, sem um logo. Um gradiente só vira um desses ativos quando a receita inteira permanece consistente. Leia mais em [ativos de marca distintivos](https://gradiently.design/pt-br/guide/distinctive-brand-assets).

## Como construir uma identidade em gradiente, passo a passo

1. **Comece pelo que você quer que as pessoas sintam** Escreva três palavras para o caráter da sua marca, como *calma, precisa, acolhedora*. Elas definem temperatura, contraste e textura antes de você olhar uma única cor. A [personalidade de marca](https://gradiently.design/pt-br/guide/brand-personality) tem um método simples.
2. **Escolha um fundo** Decida se o seu gradiente vive sobre um fundo escuro ou claro. Fundos escuros fazem a cor brilhar; fundos claros parecem leves e impressos. A maioria das identidades escolhe um e mantém.
3. **Escolha de três a cinco cores, não duas** As misturas de duas cores são as mais copiadas. Uma pequena família de cores aparentadas com um acento dá profundidade e mais chance de ser distintiva. Confira se as transições não ficam cinza no meio; veja [gradientes sujos](https://gradiently.design/pt-br/guide/muddy-gradients).
4. **Adicione um material** Grão, um brilho de seda, luz suave ou a textura de um papel mudam como as mesmas cores são lidas. É aí que mora a maior parte do caráter, e é a parte que um conta-gotas de cor não copia.
5. **Decida como ele se comporta com as palavras** Seu gradiente vai carregar títulos, preços e datas. Decida onde o texto fica e como o fundo abre espaço para ele. [Texto sobre gradiente](https://gradiently.design/pt-br/guide/text-on-gradient) trata das opções.
6. **Defina uma cor lisa de reserva** Escolha uma cor sólida do gradiente para favicons, tamanhos minúsculos, bordado e impressão em uma cor. Uma identidade em gradiente sem reserva quebra em tamanhos pequenos.
7. **Registre por escrito e use em todo lugar** Anote as cores, a direção, a textura e a cor de reserva no seu [guia de estilo da marca](https://gradiently.design/pt-br/guide/brand-style-guide) e aplique em todos os formatos na mesma semana.

- Fundo meia-noite: #0e0a1f
- Ametista profunda: #3b1d6e
- Luz violeta: #8b5cf6
- Rosa brasa: #f472b6
- Destaque quente: #fcd9c4

Uma família de gradiente: um fundo escuro, três cores ligadas e um destaque quente. O destaque é usado com parcimônia, e é isso que o torna memorável.

## Como manter o gradiente consistente em todos os formatos

Um post quadrado, um story vertical e um banner de três por um são problemas diferentes. Esticar uma só imagem de gradiente por todos eles a distorce e leva a parte mais clara para o lugar errado. A solução é tratar o gradiente como algo que você renderiza para cada formato, e não como uma imagem que você recorta.

- Post 4:5: 1080 × 1350
- Story 9:16: 1080 × 1920
- Cabeçalho do X 3:1: 1500 × 500
- Slide 16:9: 1920 × 1080

A mesma identidade, renderizada para cada formato em vez de recortada de uma única imagem.

### Evite

- Refazer o gradiente de memória a cada arquivo novo
- Recortar uma imagem larga para todos os formatos
- Um gradiente diferente para cada plataforma
- Nenhuma cor lisa para tamanhos pequenos

### Faça

- Uma receita escrita que todos usam
- Renderizar o gradiente para cada tamanho
- Uma identidade, com variação no layout e nas palavras
- Uma única cor de reserva escolhida na família

## Como ser dono de um gradiente de verdade

Mesmo um gradiente construído com cuidado pode ser copiado e reutilizado por outra pessoa. Por isso o Gradiently trata uma identidade em gradiente como um **Mark**: uma receita viva de cores, materiais, luz, grão e movimento que renderiza atrás de tudo o que você projeta, com um código público e exatamente um dono por vez. Antes de qualquer Mark novo ser publicado, ele é comparado com todos os outros, e o que ficar próximo demais é recusado, então o visual que você reserva não está no feed de outra pessoa.

Um Mark é uma identidade em gradiente com dono: a página dele mostra o código, o criador e quem o tem agora.

Você pode explorar milhares de Marks no [Mercado](/market), projetar com qualquer um deles de graça e reservar o que combina com você. Ou criar o seu na [Forge](/forge), a partir de uma frase ou controle por controle.

> **Um teste rápido** Cubra seu logo e suas palavras e mostre a um desconhecido três posts seus ao lado de três de um concorrente. Se ele não souber dizer quais são os seus, seu gradiente ainda não faz o trabalho de uma identidade.

## FAQ

### O que é branding com gradiente?

Branding com gradiente é usar uma mistura específica de cores como parte central e reconhecível da identidade de uma marca, aplicada de modo consistente em todos os formatos, como uma cor de marca característica.

### Dá para registrar um gradiente como marca?

A proteção de cores e combinações de cores depende do país e em geral exige mostrar que as pessoas já associam as cores à sua marca. Para dúvidas jurídicas, procure um profissional de propriedade intelectual.

### Quantas cores um gradiente de marca deve ter?

De três a cinco cores aparentadas costumam funcionar melhor: o bastante para dar profundidade e distinção, e poucas o bastante para manter a consistência. As misturas de duas cores são as mais fáceis de copiar.

### Logos com gradiente funcionam em tamanhos pequenos?

Muitas vezes não. Toda identidade em gradiente deve incluir uma cor lisa de reserva, tirada da família do gradiente, para favicons, ícones pequenos e impressão em uma cor.

### Como deixar meu gradiente único?

Vá além da cor: adicione um material ou uma textura, decida como ele se move e como abre espaço para as palavras, e mantenha tudo idêntico em todo lugar. No Gradiently você também pode reservar um Mark, uma identidade em gradiente com exatamente um dono.
