Como alterar a cor de fundo de um campo de e-mail

O design do seu formulário desempenha um papel importante na aparência profissional e confiável da sua loja.

Uma alteração simples, como atualizar a cor de fundo de um campo de e-mail, pode ajudar:

• Combine com a identidade da sua marca.
• Melhorar a legibilidade
• Criar uma hierarquia visual melhor
• Deixe seus formulários de contato com uma aparência mais moderna e profissional.

Antes que você comece

Certifique-se de que já possui:

• Uma página criada no GemPages
• An Elemento de campo de e-mail adicionado ao seu formulário
• Acesso ao editor GemPages

Não é necessário conhecimento avançado de programação.

Passo 1: Selecione o elemento do campo de e-mail

Abra sua página no editor GemPages. Clique no elemento Campo de E-mail que deseja personalizar. Isso garante que o estilo personalizado seja aplicado apenas ao campo selecionado.

Passo 2: Abra o painel de código personalizado

Clique com o botão direito do mouse no elemento Campo de E-mail selecionado. Em seguida, escolha: Código personalizado. O painel de Código Personalizado será exibido.

Passo 3: Adicione o código CSS

Cole o seguinte código no editor de código personalizado:

ElementoClasse entrada {

  cor de fundo: xxxxx !importante;

}

Anotações importantes

1. Você deve substituir ElementClass com o nome da classe real do seu elemento de campo de e-mail.

Você pode encontrar o nome dessa classe no canto superior esquerdo do painel Código Personalizado.

Exemplo:

.gf-input-123 input {

  cor de fundo: #f5f5f5 !importante;

}

2. Substitua xxxxx pela cor que você deseja usar.

Exemplo:

cor de fundo: #000000 !importante;

or

cor de fundo: #f5f5f5 !importante;

Como encontrar um código de cores:

Se você ainda não tem um código de cores, Você pode usar ferramentas gratuitas como:

• Seletor de cores do Google
• HTML Color Picker
• Coolors
• Adobe Color

Essas ferramentas permitem que você escolha cores visualmente e copie códigos HEX instantaneamente.

Exemplos de códigos HEX:

• # Ffffff → Branco
• #000000 → Preto
• #f3f3f3 → Cinza claro
• #1a73e8 → Azul

Resultado: