Gerador de Gradiente CSS Online - Linear e Radial

Voltar

Crie gradientes CSS personalizados de forma visual. Gere códigos para fundos lineares ou radiais e aplique-os diretamente em seus projetos web.

0%
100%

Pré-visualização

background: linear-gradient(90deg, #10b981 0%, #3b82f6 100%);

Exemplos de uso

Card de Exemplo

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Como funcionam os Gradientes CSS

Gradientes CSS permitem exibir transições suaves entre duas ou mais cores especificadas. Existem dois tipos principais: Lineares (definidos por um eixo ou ângulo) e Radiais (definidos pelo seu centro). Você pode ajustar o ângulo ou a forma, e adicionar múltiplos pontos de cor (color stops) para criar efeitos complexos.

Crie gradientes CSS personalizados de forma visual. Gere códigos para fundos lineares ou radiais e aplique-os diretamente em seus projetos web.