# Importar a marca a partir do site: preenche o kit num só passo
[Canonical HTML page](https://gradiently.design/pt-pt/guide/import-brand-from-website)
O teu site já sabe o teu nome, a tua frase de apresentação, a tua cor e o teu ícone. Um botão na página Marca lê tudo isso, e tu decides o que guardar.
## The short version
- O Gradiently consegue ler o site de uma marca e oferecer o nome, a descrição, a cor do tema e o ícone para o kit de marca.
- Nada é adicionado automaticamente: cada descoberta aparece como uma sugestão que podes usar ou ignorar.
- O nome vem das etiquetas de nome do próprio site, a descrição da sua meta descrição, a cor da etiqueta theme-color e o ícone do seu touch icon ou favicon.
- Um site sem etiqueta theme-color ou só com um ícone SVG dá menos sugestões, por isso umas linhas no head do HTML melhoram o resultado.
- Ler um site faz parte do kit de marca, que vem com o Gradiently Pro.
Para **importar a marca a partir do site** no Gradiently, abre a página Marca, escreve o teu endereço em **Site**, em Identidade, e escolhe **Ler o site**. O Gradiently obtém o nome, a descrição, a cor do tema e o ícone do site e oferece cada um: usar o nome, usar a descrição como slogan ou em Sobre, adicionar a cor às cores da marca, adicionar o ícone como logótipo. Tu escolhes o que entra. Demora uns segundos e poupa a parte mais maçadora de montar um kit.
## Como importar a tua marca a partir de um site
1. **Abre a página Marca** Escolhe a marca que queres preencher. Cada marca da tua conta tem o seu próprio kit, por isso confirma que estás na certa.
2. **Introduz o site** Em **Identidade**, escreve o endereço em **Site**. Basta um domínio simples como `crumb.co`; não precisas do https.
3. **Escolhe Ler o site** O Gradiently visita a página uma vez, lê o seu head e obtém o ícone. O botão mostra **A ler…** enquanto trabalha.
4. **Usa o que serve** Cada descoberta aparece com o seu botão: **Usar «Crumb» como nome**, **Usar a descrição como slogan**, **Usar a descrição em Sobre**, **Adicionar a cor**, **Adicionar o ícone como logótipo**. Ignora o que estiver errado.
5. **Lê de novo depois de alterações** Se atualizares o teu site, escolhe **Ler novamente**. Quando tudo o que era útil já estiver no kit, a página di-lo.
A cor do site aparece também mais tarde como sugestão na secção **Cores**, com o nome do teu site, para a poderes adicionar aí se a saltaste à primeira.
## O que o Gradiently lê do teu site
Lê apenas a página inicial pública no endereço que indicas, e só as partes que descrevem a marca. Não percorre outras páginas, não inicia sessão nem lê o teu conteúdo.
| Sugestão para o kit | De onde vem | Torna-se |
| --- | --- | --- |
| Nome | `og:site_name`, `application-name` ou o título da aplicação web da Apple | Nome da marca |
| Descrição | `meta name="description"`, ou a descrição Open Graph | Slogan ou Sobre |
| Cor | `meta name="theme-color"` em hex ou rgb() | Uma cor da marca |
| Ícone | O maior `apple-touch-icon`, outros ícones raster e depois `/favicon.ico` | Um logótipo, até 256 px |
Quatro sugestões e as suas fontes. O ícone é redesenhado como um PNG de no máximo 256 px antes de o Gradiently o guardar.
Vale a pena saber dois pormenores. Os ícones SVG são ignorados, porque o Gradiently não rasteriza o SVG de outra pessoa, por isso um site só com um favicon SVG não dá ícone. E a cor tem de ser um valor hex ou rgb() simples; uma variável CSS na etiqueta theme-color não pode ser lida.
## Torna o teu site fácil de ler
Se o Ler o site trouxer pouco, a solução costuma ser umas linhas no head do HTML do teu site. Ajudam mais do que ao Gradiently: os navegadores usam theme-color na barra de endereços dos telemóveis e as pré-visualizações de ligações usam as tuas etiquetas Open Graph. As [etiquetas Open Graph](https://gradiently.design/pt-pt/guide/open-graph-tags) e o [design de favicon](https://gradiently.design/pt-pt/guide/favicon-design) aprofundam isto.
```html
Crumb · Sourdough bakery in Leeds
```
Tudo o que o Ler o site procura: um nome do site, uma descrição numa linha, uma cor de tema em hex e um touch icon raster de 180×180.
### Dá pouco
- Sem meta descrição, ou uma cheia de palavras-chave
- Sem etiqueta theme-color, ou com uma variável CSS lá dentro
- Só um favicon SVG
- Uma página inicial que redireciona para um ecrã de login
### Dá um bom início de kit
- Uma frase honesta sobre o que fazes
- Uma cor de tema em hex que combina com o teu logótipo
- Um touch icon PNG de 180×180
- Uma página inicial pública que carrega depressa
## O que fazer depois da importação
A importação dá-te uma base, não um kit acabado. Vale a pena fazer quatro coisas a seguir, por esta ordem.
1. **Carrega ficheiros de logótipo a sério.** Um favicon é minúsculo e quadrado. Adiciona o teu logótipo completo em PNG, JPEG, WebP, GIF ou AVIF, um para fundos escuros e outro para claros; vê [logótipo sobre fundo em gradiente](https://gradiently.design/pt-pt/guide/logo-on-gradient-background).
2. **Completa as cores.** Uma cor de tema é um começo. Junta uma cor de apoio e os teus neutros mais escuro e mais claro; [como escolher as cores da marca](https://gradiently.design/pt-pt/guide/how-to-choose-brand-colors) ajuda.
3. **Define os tipos de letra.** Escolhe um para títulos e outro para o texto, ou [carrega os teus próprios ficheiros de tipos de letra](https://gradiently.design/pt-pt/guide/custom-fonts-upload).
4. **Escreve a voz.** A descrição de um site diz ao Designer o que és, não como soas. Preenche Tom, Nas tuas palavras, Sempre e Nunca; a [voz da marca para a IA](https://gradiently.design/pt-pt/guide/brand-kit-voice) mostra como.
Uma publicação de Instagram a apresentar a Crumb, uma padaria de pão de massa-mãe, com o nome e a descrição lidos do seu site
Uma primeira publicação logo a seguir à importação: nome e descrição vindos do site.
A mesma apresentação da Crumb como Story vertical de Instagram
A mesma marca como story a 1080×1920, pronta assim que o kit estiver definido.
## Quando a leitura de um site falha
Se vires **Não conseguimos ler esse site**, a página não respondeu a tempo, devolveu um erro ou bloqueou o pedido. Confirma que o endereço abre numa janela privada do navegador. Os endereços que apontam para uma rede privada, uma página de login ou um ficheiro em vez de uma página web são recusados de propósito. Um site atrás de uma proteção rígida contra robôs pode nunca ser legível; escreve os dados à mão, o que demora uns minutos.
> **Quem pode fazer isto** Ler um site faz parte do kit de marca, que vem com o Pro. Num espaço de trabalho partilhado, só os proprietários e os admins podem alterar um kit de marca. O Gradiently lê o site uma vez, quando pedes, sem cookies nem credenciais.
Com o kit preenchido, o Studio põe as tuas cores primeiro em cada seletor, oferece os teus logótipos e começa os designs nos teus tipos de letra, e o Designer escreve a partir da tua descrição. Junta-lhe um Mark que mais ninguém pode usar e as tuas publicações têm a tua cara desde a primeira. O resto do kit está coberto em [configurar o kit de marca](https://gradiently.design/pt-pt/guide/brand-kit-setup).
## FAQ
### Como obtenho as cores da minha marca a partir do meu site?
No Gradiently, introduz o teu site na página Marca e escolhe Ler o site. Se o teu site tiver uma etiqueta theme-color, a sua cor é oferecida como cor da marca.
### Porque é que o Ler o site não encontrou o meu logótipo?
Procura ícones raster, como um apple-touch-icon ou favicon.ico, e ignora ícones SVG. Adiciona um touch icon PNG ao teu site ou carrega diretamente o teu logótipo.
### A importação substitui o meu kit de marca?
Não. Cada descoberta é oferecida como sugestão e nada muda no kit até escolheres usá-la.
### Posso importar uma marca a partir do site de outra pessoa?
A ferramenta lê qualquer site público, mas usa-a para marcas que giras ou para as quais trabalhas. O kit deve conter materiais que tens o direito de usar.
### E se o meu site não tiver descrição?
O Ler o site oferece na mesma o que encontrar. Escreve à mão o teu slogan e o Sobre, e pensa em juntar uma meta descrição ao site, o que também ajuda nos resultados de pesquisa.