Skip to content
Gerador de Gradiente CSS

Crie gradientes CSS bonitos com visualização ao vivo

Configurações do Gradiente

%
%

Código CSS

background: #667eea;
background: -webkit-linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

Exemplos de Uso

Button

Crie gradientes CSS impressionantes para seus websites com nosso editor visual. Desenhe gradientes lineares, radiais e cônicos com paradas de cor ilimitadas. Visualize em tempo real, ajuste ângulos e posições, depois copie o código CSS.

Como Usar

  1. 1Selecione o tipo de gradiente: linear, radial ou cônico
  2. 2Adicione e ajuste paradas de cor clicando na barra de gradiente
  3. 3Defina o ângulo (linear) ou posição (radial)
  4. 4Visualize seu gradiente em tempo real
  5. 5Copie o código CSS gerado

Perguntas Frequentes