Gerador de Gradientes CSS

Linear cria uma transição ao longo de uma linha reta, o mais comum. Radial se espalha para fora a partir de um ponto, como um brilho. Cônico gira em torno de um ponto, formando rodas de cor e fatias de gráfico de pizza usando só CSS.

Na maioria das vezes não. Se deixadas vazias, o navegador espaça as paradas igualmente, o que é o habitual e mantém o CSS curto e fácil de editar depois. Posicione manualmente se quiser que uma cor dure mais tempo ou crie uma borda nítida entre as cores.

Dê a duas paradas a mesma posição. Um gradiente que vai de uma cor a 50% para outra cor também a 50% muda instantaneamente, sem degradê. Junto com o modo repetição, isso cria listras sem nenhuma imagem.

Cada cor é analisada e reescrita, em vez de ser copiada diretamente. Isso assegura que o código gerado é uma cor válida, o que é importante porque o valor vai para um arquivo de estilos. Se a cor não for reconhecida, é rejeitada em vez de ser incluída silenciosamente.

Gradientes lineares e radiais funcionam em todos há muitos anos. O cônico é mais novo, mas suportado pelos navegadores atuais. Se precisar dar suporte a navegadores muito antigos, o gerador mostra uma cor sólida que você pode usar como fallback.