Crie gradientes visualmente com pré-visualização ao vivo. Ajuste cores, posições e ângulos em tempo real.
Três tipos de gradiente
Suporte para gradientes linear, radial e cônico com controle total sobre direção e forma.
100% lado do cliente
Todo o processamento ocorre no seu navegador. Os dados nunca saem do seu dispositivo.
Como criar um gradiente CSS
Crie gradientes CSS lindos visualmente com o Gerador de Gradiente gratuito do The IT Hustle.
1
Escolha um tipo de gradienteSelecione entre os tipos linear, radial ou cônico nas opções no topo.
2
Escolha suas coresUse os seletores de cor para definir os pontos de parada do gradiente. Adicione vários pontos para gradientes complexos.
3
Ajuste a direçãoPara gradientes lineares, defina o ângulo. Para gradientes radiais, escolha a forma e a posição.
4
Copie o código CSSClique no botão Copiar para copiar o código CSS gerado, pronto para colar na sua folha de estilos.
Perguntas frequentes
A ferramenta suporta gradientes lineares (transições em linha reta), gradientes radiais (transições circulares) e gradientes cônicos (transições baseadas em ângulo).
Sim. Adicione quantos pontos de cor quiser para criar gradientes multicoloridos complexos. Cada ponto pode ser posicionado com precisão.
Sim. A saída usa a sintaxe padrão de gradiente CSS, suportada por todos os navegadores modernos, incluindo Chrome, Firefox, Safari e Edge.