Veja os passos para alterar as cores de elementos do layout, para personalizar a loja virtual de acordo identidade visual da sua marca.
Acesse o painel Nuvemshop e siga pelo caminho "Minha Nuvemshop > Personalizar layout".
Clique na opção Cores da sua marca no menu lateral para acessar as configurações das cores da sua loja virtual.
Selecionando suas cores
1 - Cores da sua marca: você verá os elementos que pode personalizar, como: Cor principal, Cor secundária e Cor de destaque.
2 - Botão de compra: você poderá personalizar tanto a cor de fundo, quanto a cor do texto do botão.
Além disso, ao selecionar a opção "Inverter as cores do botão", o layout irá inventer as cores e aplicar uma borda da cor de fundo do botão.
- Cores padrões no botão de compra;
- Cores invertidas no botão de compra.
3 - Cores de contraste: você poderá personalizar tanto a cor de fundo, quanto a cor do texto.
4 - Etiquetas de frete grátis e desconto: você poderá personalizar tanto a cor de fundo, quanto a cor do texto da etiqueta.
Dica: recomendamos não utilizar mais de quatro cores diferentes para manter a identidade visual da sua marca.
- Clique no círculo de cor de cada elemento que deseja alterar para eleger a cor de sua preferência. Para usar uma cor diferente das que já aparecem como sugestão, basta clicar em "Nova cor".
Ao selecionar uma cor, você pode:
- Mudar a escala na barra do lado direito;
- Selecionar o tom da cor no quadrado, no lado esquerdo;
- Utilizar código chamado 'hexadecimal' na personalização do seu Layout.
Quando finalizar a escolha da cor, clique em "Usar esta cor". Automaticamente a mesma será implementada em seu layout para uma melhor visualização de como ficará antes de salvar.
Importante!
Na hora de selecionar as cores de seu layout, fique atento ao contraste entre a cor principal e secundária, e entre a cor de fundo e cor de texto dos elementos. Ao fazer isso, você evitará que elementos fiquem ocultos ou em uma configuração que dificulte a sua visualização/leitura.
Cores pré-determinadas
No Flex existem combinações de cores pré-determinadas, que seguem o padrão de tema para cada segmento.
Ao selecionar a combinação pré-definida, sua loja terá as mesmas cores que demonstramos no layout escolhido de acordo com o tema em uso.
Ao escolher a combinação, o layout mostrará a visualização de como as cores se aplicam, no lado direito da tela de edição. Além disso, você pode selecionar a versão mobile, para visualizar como o site é apresentado em celulares e tablets.
Após escolher as cores para os elementos, clique "Publicar alterações" para finalizar.
Pronto! 🙌
As novas cores já estão aplicadas em sua loja.
Atenção: caso sua página não esteja condizendo com a versão do manual entre em contato para atualizar sua versão do Tema Flex.