Ferramenta Gratuita
CSS Gradient Generator
Crie gradientes CSS lineares, radiais e cônico visualmente. Arraste os pontos 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°
Pontos 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 de um ponto central. Gradientes cônico varrem ao redor de um ponto central — útil para gráficos de pizza e rodas de cores.
Como usar
- Escolha um tipo de gradiente (linear, radial ou cônico).
- Adicione ou arraste pontos 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 qualquer servidor.
Perguntas Frequentes
- O CSS gerado é compatível entre navegadores?
- Sim. A saída usa sintaxe padrão de gradiente CSS 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.