# Como fazer um guia de estilo de marca que as pessoas usam

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

A maioria dos guias de estilo é aberta uma vez e esquecida. Os que funcionam são curtos, mostram cada regra e ficam onde as pessoas projetam. Veja como escrever um assim.

## The short version

- Um guia de estilo de marca é um documento curto de regras que diz a qualquer pessoa como aplicar o logo, as cores, a tipografia, os fundos, as imagens e a voz de uma marca.
- Os guias são usados quando escritos como regras específicas com exemplos, e não como descrições de como a marca deve ser sentida.
- A maioria das marcas pequenas precisa só de um guia de uma página com posicionamento, voz, logo, cores com proporções, tipografia, fundo e alguns exemplos de faça e não faça.
- Cada regra é mais fácil de seguir quando aparece ao lado de um exemplo correto e de um incorreto.
- Um guia de estilo continua vivo quando uma pessoa cuida dele, ele traz uma data e suas regras estão embutidas nos templates que as pessoas já usam.

Um **guia de estilo de marca** é um conjunto curto de regras que permite a qualquer pessoa, de quem acabou de entrar na equipe a um freelancer ou a um assistente de IA, criar algo com a aparência e o tom da sua marca. Os que as pessoas realmente usam têm três traços em comum: são curtos, são escritos como regras específicas em vez de descrições e cada regra vem com um exemplo. Para a maioria das marcas pequenas, uma página bem-feita vale mais do que um PDF de cinquenta páginas que ninguém abre.

Um guia de estilo é a metade escrita da sua identidade; o [kit de marca](https://gradiently.design/pt-br/guide/brand-kit) são os arquivos. Você precisa dos dois, e eles devem apontar um para o outro.

## O que incluir em um guia de estilo de marca

| Seção | Guia de uma página | O guia completo acrescenta |
| --- | --- | --- |
| Posicionamento | Uma frase: o que você faz e para quem | Notas sobre o público, mensagens-chave |
| Voz | Três palavras, duas frases de exemplo | Lista de palavras, palavras a evitar, tom por canal |
| Logo | Versão principal e de uma cor, tamanho mínimo, área de respiro | Lockups, co-branding, exemplos de mau uso |
| Cor | Códigos hex com nomes, funções e proporções | RGB, CMYK, combinações de texto acessíveis |
| Tipografia | Fontes de título e de texto com tamanhos | Escala tipográfica completa, fontes web e de reserva |
| Fundo | O fundo da marca e sua cor lisa de reserva | Variações por formato, regras de textura |
| Imagens | Três imagens de exemplo e uma frase | Tratamento de fotos, regras de ilustração |
| Faça e não faça | De quatro a seis pares | Um par por seção |

Comece pela coluna do meio. Só acrescente a da direita quando uma dúvida real aparecer duas vezes.

## O que deixar de fora

- **Histórias longas da marca e ensaios de quem fundou.** Eles pertencem à página Sobre, não a um documento de trabalho.
- **Valores escritos em uma só palavra**, como “inovação” e “qualidade”. Ninguém consegue aplicá-los.
- **Cada tom possível de cada cor.** Liste os que você realmente usa.
- **Páginas de mau uso do logo** que ninguém faria. Mostre os dois ou três erros que as pessoas realmente cometem.
- **Regras que você não vai fazer valer.** Cada regra ignorada ensina às pessoas que o guia inteiro é opcional.

## Escreva regras, não descrições

A falha mais comum nos guias de estilo é descrever onde deveria instruir. “Nossa paleta é vibrante e otimista” não diz nada a quem projeta. “Coral é só para botões e preços” diz exatamente o que fazer. Cada linha do seu guia deve ser algo com que uma pessoa possa conferir um design.

### Descrição (inútil)

- Nossas cores são ousadas e cheias de energia
- Nossa tipografia é moderna e limpa
- Usamos muito espaço em branco
- Nossa voz é amigável, mas profissional
- As fotos devem parecer autênticas

### Regra (útil)

- O azul-noite cobre cerca de 60% de cada design; o coral é só para botões e preços
- Títulos na fonte display em 64 px ou mais; texto em 16 px, nunca em negrito
- Mantenha uma margem de pelo menos 8% da largura em todos os lados
- Use contrações, frases curtas e nenhum ponto de exclamação
- Só luz natural, pessoas no meio de uma tarefa, sem sorrisos posados para a câmera

## Um exemplo de guia de estilo de marca de uma página

Aqui está um guia completo de uma página para uma padaria inventada. Ele cabe em uma única tela e responde à maioria das perguntas que um freelancer faria.

```text
CORNER LOAF: BRAND STYLE GUIDE (v1.2, updated October 2026, owner: Sam)

WHO WE ARE
The neighbourhood bakery that bakes overnight in small batches.

VOICE: warm, unhurried, honest
Yes: "Rye's back tomorrow. We made forty."
No:  "Don't miss our AMAZING new rye!!!"

COLOUR (share, job)
Night blue  #0e1424  60%  backgrounds
Flour       #f3e6d0  30%  text and panels
Oven glow   #e0823d  10%  times, prices, buttons only

TYPE
Headlines: condensed sans, 64 px and up, sentence case
Body: humanist sans, 16 to 18 px, regular weight

BACKGROUND
Signature: oven glow rising from the bottom of night blue
Fallback (small sizes, one-colour print): flat night blue

LOGO
Wordmark only. Minimum width 96 px. Clear space = height of the C.

DON'T
Put text over the glow. Use cream backgrounds. Add a second accent.
```

Cada linha pode ser conferida em um design pronto. Esse é o teste de um guia utilizável.

## Mostre cada regra com um exemplo

As pessoas dão uma passada de olhos nos guias e olham as imagens. Coloque um exemplo correto e um incorreto ao lado de cada regra importante, de preferência com formatos reais do seu próprio feed. A regra abaixo é uma de que toda marca de gradientes ou de fotos precisa: onde ficam as palavras.

Um post vertical em que o título cruza uma parte clara e movimentada do fundo e fica difícil de ler

Incorreto: o título passa sobre a parte mais movimentada e mais clara do fundo.

O mesmo post com uma área calma e escura do fundo atrás do título, que fica legível

Correto: a área mais calma e mais escura fica atrás das palavras.

As cores pedem o mesmo tratamento. Liste cada uma com nome, código, função e proporção, e inclua as combinações de texto que passam nas verificações de [contraste de cores](https://gradiently.design/pt-br/guide/color-contrast-accessibility), para que ninguém precise testá-las de novo.

- Azul-noite: fundos: #0e1424
- Farinha: texto, painéis: #f3e6d0
- Brasa do forno: destaques: #e0823d

Nome, função e proporção de cada cor. Farinha sobre azul-noite mede cerca de 14,9:1; brasa do forno sobre azul-noite, cerca de 6,5:1.

## Como manter um guia de estilo vivo

1. **Dê um responsável a ele** Uma pessoa com nome aprova as mudanças e responde às dúvidas. Um guia que é de todos não é atualizado por ninguém.
2. **Coloque data e versão** Ponha a versão e a data no topo para que as pessoas saibam que estão com a atual.
3. **Embuta as regras nos templates** A melhor regra é a que ninguém quebra sem querer. Templates com o fundo, a tipografia e a posição do logo certos fazem o guia valer em silêncio. Veja [consistência de marca](https://gradiently.design/pt-br/guide/brand-consistency).
4. **Deixe-o onde as pessoas trabalham** Fixe-o na ferramenta de design, no drive compartilhado e no chat da equipe. Se as pessoas precisarem procurar, não vão usar.
5. **Escreva uma versão para a IA** Os assistentes seguem bem regras claras e literais. [Diretrizes de marca que sua IA consegue seguir](https://gradiently.design/pt-br/guide/brand-guidelines-for-ai) mostra como adaptar a página.
6. **Revise a cada trimestre** Apague as regras que ninguém segue e acrescente as dúvidas que as pessoas tiveram duas vezes.

No Gradiently, o kit de marca reúne seus logos, cores e fontes ao lado de cada design, e o seu Mark carrega o fundo da marca, então a maior parte das regras de um guia de uma página já está aplicada quando alguém abre um template.

## FAQ

### O que um guia de estilo de marca deve incluir?

No mínimo: posicionamento, voz, regras do logo, cores com códigos hex e proporções, fontes com tamanhos, o fundo da marca e sua reserva, orientação sobre imagens e alguns exemplos de faça e não faça.

### Qual deve ser o tamanho de um guia de estilo de marca?

O menor possível, desde que ainda responda a dúvidas reais. Para a maioria das marcas pequenas uma página basta; acrescente seções só quando a mesma dúvida aparecer duas vezes.

### Qual é a diferença entre guia de estilo e kit de marca?

O guia de estilo são as regras. O kit de marca são os arquivos: logos, fontes, códigos de cor, fundos e templates. Cada um deve ter um link para o outro.

### Como faço as pessoas seguirem as diretrizes da marca?

Escreva regras específicas com exemplos, dê um responsável ao guia e embuta as regras nos templates, para que a escolha correta seja a mais fácil.