Configurações de cor

Muitos blocos no editor do WordPress contêm configurações para você controlar as cores do seu conteúdo. Este guia mostra como usá-las.

Neste guia

1. Acessar as configurações de cor
2. Selecionar uma cor sólida
3. Selecionar um gradiente
4. Selecionar um filtro duotônico

Acessar as configurações de cor

As configurações de cor estão disponíveis para:

• Estilos – mude as cores usadas no site inteiro de uma vez só.
• Blocos – mude as cores de elementos específicos.

Ao clicar em um bloco, serão exibidas configurações na barra lateral direita. Se você não estiver vendo a barra lateral, clique no ícone Configurações no canto superior direito para exibi-las. Esse ícone se parece com um quadrado com duas colunas irregulares:

Clique no ícone Configurações para abrir as configurações do bloco

Você logo acha as configurações de cor nas configurações do bloco. As configurações de cor de outros blocos ficam na guia Estilos. A imagem à direita mostra um bloco de coluna com as configurações de cor na guia Estilos. Para acessá-la, basta clicar no ícone circular.

Nem todo bloco tem configurações de cor. A disponibilidade dessas configurações depende do tema e do tipo de bloco.

Exemplo de configurações de cor no bloco de colunas.

Selecionar uma cor sólida

Com o seletor de cores, você pode escolher uma cor para elementos diferentes no bloco, como texto, plano de fundo e links. Clique em cada seção enumerada correspondente de acordo com a explicação abaixo:

1. Clique no círculo de cor para abrir o seletor.
2. Clique em qualquer um dos pontos já coloridos para selecionar uma opção de cor pré-definida da sua paleta. Você pode escolher quais cores aparecem aqui usando os estilos.
3. Clique no quadrado para definir uma cor personalizada.
4. Se você já tiver um código de cor personalizada que gostaria de usar, basta inseri-lo no quadrado. O código será atualizado automaticamente se você escolher outra cor usando uma das opções mostradas acima.
5. Clique no menu suspenso para selecionar um perfil de cor diferente. Você pode escolher Hex, RGB ou HSL.
6. Clique e arraste o ícone circular para a esquerda ou direita para aumentar ou diminuir a opacidade ou transparência da cor escolhida.
7. Clique e arraste o ícone circular para a esquerda ou direita para selecionar outra cor.
8. Clique e arraste o ícone circular para qualquer parte do quadrado para selecionar um tom diferente da cor atual.
9. Clique no ícone para copiar o código da cor atual para sua área de transferência.
10. Clique nos três pontos e depois em Redefinir para reverter qualquer uma das opções de cores selecionadas. Com isso, as cores usadas serão as padrão do tema.

Para redefinir a cor escolhida, clique no botão Limpar na parte inferior direita da área de seleção de cor.

Selecionar um gradiente

Com gradientes, você pode selecionar duas ou mais cores para formarem um degradê. Clique em cada seção enumerada correspondente de acordo com a explicação abaixo:

1. Clique no círculo de cor para abrir o seletor.
2. Clique para definir uma cor sólida para o fundo. Funciona da mesma forma que as cores de texto e links mencionadas acima.
3. Clique para definir um gradiente para o fundo.
4. Clique em qualquer um dos pontos já coloridos para selecionar um gradiente pré-definido da sua paleta. Você pode mudar as cores que aparecem aqui usando os estilos.
5. Clique em um dos ícones circulares no retângulo colorido para selecionar uma cor personalizada para incluir no gradiente. Você também pode clicar em qualquer outra seção nessa área para adicionar mais cores.
6. Clique no menu suspenso para selecionar o tipo do gradiente. Você pode escolher entre linear e radial:
   • Linear cria um gradiente entre as duas cores em uma linha reta.
   • Radial começa no centro e expande para as bordas.
7. Edite o número na caixa para incluir um valor personalizado para o ângulo do gradiente. Isso só aparece quando você seleciona o tipo de gradiente linear.
8. Clique e arraste o pequeno ponto colorido dentro do círculo para ajustar o ângulo do gradiente. Isso substitui automaticamente o valor do ângulo mencionado na etapa 7 acima.

Para redefinir a cor escolhida, clique no botão Limpar na parte inferior direita da área de seleção de cor.

Selecionar um filtro duotônico

A opção de filtro duotônico é um efeito de cor com dois tons que você pode aplicar em blocos como os de cobertura e de imagem. É como fotos em preto e branco, só que em qualquer combinação de cores que você quiser. 

Para começar, selecione o botão do filtro duotônico na barra de ferramentas, ou nas configurações do bloco, e escolha um dos exemplos ou defina suas próprias cores:

Para definir suas próprias cores, selecione os pontos nas barras de cores:

Para remover o filtro duotônico, clique no botão Limpar na parte inferior direita da área de seleção de cor.