Configurando o e-commerce: cores e estilo da sua loja

Primeira seção da personalização visual: paleta de cores, tipografia e caixa de texto

Publicado por Thallita Bezerra em 18/8/2026

A seção Cores e estilo é o primeiro passo da personalização visual do e-commerce do Collaborative, e é ela que define a primeira impressão de quem visita seu site.

Neste artigo, o primeiro de uma série sobre a configuração completa do e-commerce, mostramos como funciona cada campo dessa seção e como usá-los para deixar a loja com a cara da sua marca.

Onde encontrar essa configuração

Para acessar, vá em e-commerce > personalizações > cores e estilo.

Paleta de cores

A paleta de cores define as cores principais que aparecem em toda a loja. São 4 campos, cada um com uma função específica:

  • Primária: cor dos botões de ação, como “Comprar” e “Adicionar ao carrinho”.
  • Secundária: cor dos botões ao clicar, dos links e das bordas.
  • Fundo do site: cor de fundo de todas as páginas da loja.
  • Texto: cor dos títulos, nomes de produtos e textos gerais.

Cada cor pode ser definida pelo código hexadecimal, o que garante que a paleta fique exatamente igual à identidade visual já usada em outros canais da marca.

Caso queira que os botões tenham a mesma cor ao clicar, adicione a mesma cor em primária e secundária.

Seção Paleta de cores, com os campos Primária, Secundária, Fundo do site e Texto

Fonte do site

A tipografia também é personalizável, e o Collaborative oferece 4 opções, cada uma com uma personalidade diferente:

  • Moderna: Poppins, limpa e contemporânea.
  • Elegante: Cormorant, refinada e delicada.
  • Minimalista: Raleway, fina e atual.
  • Clássica: Merriweather, tradicional e legível.

A escolha da fonte muda o tom da loja inteira, então vale escolher a opção que mais combina com o estilo dos produtos e o público da loja.

Seção Fonte do site, com as opções Moderna, Elegante, Minimalista e Clássica

Caixa do texto

Esse campo define como os títulos de produtos e os itens do menu vão aparecer na loja:

  • Normal: apenas a primeira letra maiúscula.
  • Caixa alta: todo o texto em maiúsculas.

Seção Caixa do texto, com as opções Normal e Caixa alta

Depois de ajustar os campos, clique em Salvar para aplicar as mudanças na loja.

Identidade visual consistente, direto no e-commerce

Com esses três campos configurados, sua loja já ganha uma identidade visual própria, alinhada com o resto da marca. Nos próximos artigos da série, vamos explorar as outras seções da configuração do e-commerce. Alguma dúvida sobre essa seção? Fale com o nosso suporte.