Gerador de Gradientes Aleatórios
Gere gradientes CSS aleatórios — lineares, radiais, cônicos. Combinações harmoniosas, código CSS pronto para colar. No seu navegador.
background: linear-gradient(45deg, #000, #fff);
bg-gradient-to-br from-[#000] to-[#fff]
Histórico
Referência
Como funciona o gerador de gradientes?
Esta ferramenta escolhe 2-3 cores usando teoria de cor harmônica (relações análogas, complementares ou triádicas) com rotações de matiz HSL. Ângulos ou posições aleatórias são escolhidos com crypto.getRandomValues(). A saída é renderizada como pré-visualização ao vivo ao lado do código CSS pronto para colar.
Tipos de gradiente
- Linear — as cores se misturam ao longo de uma linha reta com ângulo configurável.
- Radial — as cores irradiam a partir de um ponto central.
- Cônico — as cores giram em torno de um centro, como uma roda de cores.
Usos comuns
- Hero sections — fundos chamativos para landing pages.
- Cards e botões — acentos UI modernos com profundidade.
- Inspiração de design — descubra combinações inesperadas de cores.
- Wallpapers e banners — gere ativos visuais únicos.
Privacidade
Todos os gradientes são gerados 100% no seu navegador. Nenhum dado enviado.