Gerador de Gradiente CSS

Crie gradientes suaves e copie o código CSS instantaneamente.

Configuração

Resultado do Gradiente

Cores Intermédias

Código CSS

background: #667eea; /* Old browsers */
background: -moz-linear-gradient(left, #667eea 0%, #764ba2 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #667eea 0%,#764ba2 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #667eea 0%,#764ba2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

Como usar o Gerador de Gradiente CSS

Nossa ferramenta permite criar gradientes lineares perfeitos para seus projetos web. Basta selecionar a cor inicial e a cor final usando os seletores de cores. O gerador exibirá uma prévia do gradiente e fornecerá automaticamente o código CSS compatível com os principais navegadores.

Além disso, você pode ver as cores intermediárias geradas entre os dois pontos, o que é útil para criar paletas de cores harmônicas.