Gerador de gradiente linear CSS
Crie gradientes CSS visualmente: tipo linear, radial ou cônico, controle deslizante de ângulo e até seis pontos de cor com visualização ao vivo de largura total e código copiável.
Resultado
Esta página abre o gerador de gradiente com o tipo linear já selecionado. Arraste o controle deslizante de ângulo para girar o fade, ajustar as paradas de cor e a visualização de largura total, além da atualização da linha CSS em cada entrada.
linear-gradient() pinta cores ao longo de uma linha reta - de longe o gradiente mais usado em CSS. 90 graus vão da esquerda para a direita, 180 graus de cima para baixo e qualquer ângulo intermediário fornece uma diagonal; as posições de parada em porcentagem decidem onde cada faixa de cor começa a se misturar com a próxima.
Quando a visualização parecer correta, copie a linha de fundo em sua folha de estilo. Se você quiser um ponto de partida em vez de uma tela em branco, as páginas predefinidas de pôr do sol, oceano e pastel abrem essa mesma ferramenta com pares de cores comprovados já carregados.