Escolha cores. Copie o CSS. Pronto.
background: linear-gradient(135deg, #6366F1, #EC4899);O GradientLab ajuda você a criar belos gradientes CSS sem escrever código manualmente. Escolha duas cores, defina a direção e visualize instantaneamente o resultado. A ferramenta suporta tanto gradientes lineares quanto radiais, permitindo alternar entre eles com um único clique. Quando estiver satisfeito com o visual, copie o CSS pronto para produção e cole diretamente na sua folha de estilos ou configuração do Tailwind. Tudo funciona localmente no seu navegador, então seu trabalho permanece privado.
Um gradiente linear faz a transição entre cores ao longo de uma linha reta em um ângulo específico, ideal para fundos, seções hero e banners. Um gradiente radial irradia para fora a partir de um ponto central, funcionando bem para efeitos de destaque e elementos de interface circulares. O GradientLab permite controlar o ângulo dos gradientes lineares e visualizar a opção radial em tempo real, para que você possa comparar ambos os estilos antes de se decidir.
Não sabe por onde começar? Navegue por 12 predefinições de gradientes selecionadas para design web moderno, ou pressione o botão Aleatório para descobrir combinações de cores inesperadas. Cada predefinição é totalmente editável, então você pode usá-la como ponto de partida e ajustar as cores e o ângulo. Quando estiver pronto, o botão de cópia com um clique coloca a regra CSS completa na sua área de transferência, incluindo a cor de fundo de fallback para navegadores mais antigos.
Precisa escolher cores exatas primeiro? Experimente o Seletor de cores para encontrar os valores HEX ou RGB perfeitos. Quando seu design estiver finalizado, emoldure suas capturas de tela com a ferramenta Screenshot Mockup para apresentar seu gradiente em uma moldura de navegador polida para portfólios e redes sociais.
Generate a matching favicon using the favicon generator or optimize your exported images with the image compressor.