Gerador de Gradiente CSS

Como usar isso generator

1. Escolha o modo linear ou radial, aplique uma predefinição ou edite cada parada de cor e, em seguida, ajuste as posições e o ângulo, quando aplicável.
2. Revisar o resultado em tempo real e utilizar a opção Copiar resultado quando precisar compartilhá-lo.

Como generator works

Os controles de visualização ao vivo e de parada geram uma declaração de fundo CSS padrão sem prefixo que pode ser copiada ou baixada.

Passo a passo generation

1. Escolha o modo linear ou radial, aplique uma predefinição ou edite cada parada de cor e, em seguida, ajuste as posições e o ângulo, quando aplicável.
2. Os controles de visualização ao vivo e de parada geram uma declaração de fundo CSS padrão sem prefixo que pode ser copiada ou baixada.
3. Verifique o resultado exibido e copie-o, se necessário.

Exemplo prático

Um gradiente linear de 135 graus pode misturar várias paradas de cor posicionadas, como azul a 0%, verde a 50% e amarelo a 100%.

Perguntas frequentes

Ferramentas relacionadas