Estilo do bloco: fundo, outra cor de fundo e cor do texto
Mude o fundo de uma seção (sem fundo, cinza claro, cor principal ou de destaque), escolha uma cor própria e ajuste a cor do texto.
Neste artigo
Todo bloco livre tem duas abas nas opções: Conteúdo (textos, fotos, links) e Estilo (aparência). Os três primeiros campos da aba Estilo cuidam das cores: Fundo, Outra cor de fundo e Cor do texto. Servem para alternar seções claras e escuras e dar ritmo à página.
- A aba Estilo aparece nos blocos livres (banner, vitrines, textos...). Cabeçalho, rodapé e Estilo do site são partes fixas e têm opções próprias.
- Clique no bloco na prévia ou na aba Blocos e depois em Estilo, ao lado de Conteúdo.
1234- 1A aba Estilo fica ao lado de Conteúdo.
- 2Fundo: Sem fundo, Cinza claro, Cor principal ou Cor de destaque.
- 3Outra cor de fundo.
- 4Cor do texto.
Fundo
| Opção | Resultado |
|---|---|
| Sem fundo | Fica da cor da página (branco). É o padrão. |
| Cinza claro | Usa a cor "Fundo das seções claras" definida na aba Estilo do site. Ótima para alternar com seções brancas. |
| Cor principal | Pinta a seção com a cor principal do site (normalmente escura) e passa os títulos para branco. |
| Cor de destaque | Pinta com a cor de destaque (a dos botões), com título branco e botões invertidos para continuar visíveis. |
Boa prática: alterne sem fundo e cinza claro nas seções comuns e use cor principal ou cor de destaque uma ou duas vezes por página, em seções importantes (números, chamada de WhatsApp, captação).
Outra cor de fundo
Se as quatro opções não bastam, use este campo para uma cor exata. Ele tem o quadrado colorido (paleta), a caixa onde você digita o código e o botão × para voltar ao automático. O código aceita #4a5a3a, 4a5a3a e #4a5. A cor escolhida aqui vale por cima do campo Fundo.
123- 1Quadrado de cor: abre a paleta.
- 2Ou digite o código: #4a5a3a, 4a5a3a ou #4a5.
- 3×: volta ao automático.
Cor do texto
Muda a cor do texto do bloco (títulos, parágrafos, links simples). Deixe vazio para o site decidir sozinho: por exemplo, em seções com fundo escuro o texto já fica claro. Só use este campo quando precisar forçar uma cor.
12- 1Cor do texto: deixe vazio para o site escolher.
- 2Logo abaixo ficam alinhamento, espaço e largura.
Passo a passo para criar uma seção escura
- Selecione o bloco (por exemplo, "Números").
- Abra a aba Estilo.
- Em Fundo, escolha "Cor principal".
- Confira na prévia. O texto deve ficar branco. Se não ficar legível, use "Cor do texto".
- Clique em Verificar para medir o contraste.
12- 1O bloco escolhido na prévia.
- 2Verificar: mede o contraste entre texto e fundo.
Perguntas frequentes
Escolhi "Cor principal" e o texto sumiu.
Isso acontece quando "Cor do texto" foi definida com uma cor escura. Limpe o campo com o × para o site escolher o branco.
Quero copiar essas cores para outros blocos.
Use Copiar e colar estilo: botão direito no bloco › Copiar estilo; depois, no outro bloco › Colar estilo.
Veja também
Cores e fontes do site · Verificar a página · Banner com busca