Ferramenta Gratuita
CSS Gradient Generator
Crie gradientes CSS lineares, radiais e cônicos visualmente. Arraste paradas de cor, ajuste o ângulo e a posição, e copie o CSS pronto para usar.
CSS
background: linear-gradient(135deg, #6366f1 0%, #06b6d4 100%);Tipo
Ângulo135°
Paradas de Cor
0%
100%
Predefinições
Tipos de gradiente
Gradientes lineares fazem transição ao longo de uma linha reta em qualquer ângulo. Gradientes radiais irradiam a partir de um ponto central. Gradientes cônicos varrem em torno de um ponto central — úteis para gráficos de pizza e rodas de cores.
Como usar
- Escolha um tipo de gradiente (linear, radial ou conic).
- Adicione ou arraste paradas de cor para definir as cores.
- Copie a saída CSS diretamente para sua folha de estilos.
Todo o processamento acontece no seu navegador — nada é enviado para nenhum servidor.
Perguntas Frequentes
- O CSS gerado é compatível entre navegadores?
- Sim. A saída usa sintaxe de gradiente CSS padrão suportada por todos os navegadores modernos.
- Posso compartilhar um gradiente?
- Sim. Clique em Compartilhar — o estado do gradiente é codificado na URL, que você pode copiar e enviar.