Ferramentas de cor

Gerador de Gradiente CSS: Linear, Radial e Cônico – Grátis

Grátis, sem cadastro e funciona no seu navegador. Crie um gradiente linear, radial ou cônico com até 8 pontos de cor, veja ao vivo e copie o CSS. Baixe como fundo PNG em tamanhos comuns.

Tipo

Paradas de cor

CSS

background: #ff7ac6;
background: linear-gradient(135deg, #ff7ac6 0%, #ffe14d 100%);

A primeira linha é uma cor sólida para dispositivos muito antigos que não mostram gradientes.

Comece de um modelo

Criado no seu dispositivo.

Por que usar Gerador de Gradiente CSS

100% grátis
Use quantas vezes quiser. Sem cadastro, sem marca d'água, sem instalar nada.
Privacidade desde o início
O que você digita fica no seu navegador e nunca é enviado para nós.
Funciona em qualquer dispositivo
Roda no navegador no Windows, Mac, Linux, Android e iPhone. Não precisa de app.

Como usar Gerador de Gradiente CSS

  1. Escolha linear, radial ou cônico e defina a direção.
  2. Escolha as cores e arraste cada ponto para o lugar.
  3. Copie o CSS ou baixe o gradiente como imagem.

Perguntas frequentes

Como uso o CSS?
Cole na regra do elemento que você quer colorir. A primeira linha é uma cor sólida de reserva; a segunda é o gradiente.
Qual é a diferença entre linear, radial e cônico?
O linear mistura as cores ao longo de uma linha reta, o radial se espalha a partir do centro e o cônico gira em volta do centro como um círculo cromático.
Posso usar transparência?
Sim. Digite uma cor como rgba(47, 91, 255, 0.5) em um ponto.
Algo é enviado?
Não. Os gradientes são criados no seu dispositivo.
Gerador de Gradiente CSS é grátis?
Sim. É grátis para usar, sem cadastro e sem instalar nada.

Ajuda e guias práticos (em inglês)

Ferramentas relacionadas