Usar gradientes

Visão geral da ferramenta Gradiente

Um gradiente é um preenchimento de várias cores em que cada uma delas muda gradualmente para a próxima. Os gradientes podem ser aplicados à borda ou ao preenchimento de elementos.

Nem todos os navegadores são compatíveis com gradientes de borda.

 

O Google Web Designer pode criar dois tipos de gradiente:

• Os gradientes lineares mudam de cor ao longo de uma linha reta entre dois pontos de extremidade.
• Os gradientes radiais alteram as cores de maneira concêntrica a partir de um único ponto central.

Para criar um gradiente, siga estas etapas:

1. Selecione o botão Gradiente linear ou Gradiente radial na parte superior do misturador de cores.
2. Por padrão, os gradientes possuem dois marcadores de cor ao longo da barra correspondente na parte superior da tela. Selecione um marcador de cor para mudar a cor do gradiente.
3. Arraste um marcador de cor ao longo da barra para alterar a distância de transição.
4. Para adicionar mais marcadores de cor, clique na barra de gradientes. Para remover um marcador de cor, arraste-o para o campo de cores.

Gradientes lineares

Por padrão, o gradiente estende-se da extremidade esquerda para a direita do elemento a que é aplicado.

Para alterar como o gradiente linear é aplicado, siga estas etapas:

1. Selecione a ferramenta Gradiente na barra de ferramentas à esquerda ou pressione a tecla A.
2. Selecione o elemento com um gradiente que você quer editar.
3. Selecione a opção Editar traço ou Editar preenchimento da barra de opções da ferramenta na parte superior da tela.
4. Ajuste o gradiente arrastando as alças de controle vermelhas:

   • Arraste as alças externas para alterar como o gradiente é aplicado ao objeto. Os gradientes não podem ultrapassar a borda das formas SVG, conforme mostrado no primeiro exemplo abaixo.
     

   • Arraste a alça interna para girar o gradiente ao redor do ponto central preto. O gradiente é redimensionado automaticamente para permanecer proporcional ao elemento. Como opção, pressione a tecla Shift ao arrastar os elementos para limitar a rotação a acréscimos de 45°.
     

Para redefinir o gradiente à sua aparência padrão, clique duas vezes no botão ferramenta Gradiente .

Gradientes radiais

Por padrão, os gradientes radiais são aplicados a uma forma oval definida pelo centro e pelos cantos do elemento.

Para alterar como o gradiente é aplicado, siga estas etapas:

1. Selecione a ferramenta Gradiente na barra de ferramentas à esquerda ou pressione a tecla A.
2. Selecione o elemento com um gradiente que você quer editar.
3. Selecione a opção Editar traço ou Editar preenchimento da barra de opções da ferramenta na parte superior da tela.
4. Ajuste o gradiente arrastando as alças de controle vermelhas:

   • Arraste as alças externas para redimensionar o gradiente. Como opção, pressione a tecla Ctrl (Windows) ou ⌘ (Mac) ao arrastar a alça para redimensionar proporcionalmente os eixos X e Y do gradiente ou pressione a tecla Shift ao arrastar a alça para limitar a forma do gradiente a um círculo.
     

   • Arraste a alça para mover o ponto central do gradiente.
     

Para redefinir o gradiente à sua aparência padrão, clique duas vezes no botão ferramenta Gradiente .