Gerador de gradiente CSS
Crie belos gradientes CSS lineares e radiais com editor visual
Gradient Settings
CSS Output
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
CSS Gradient Generator
Create beautiful linear and radial CSS gradients with a live preview. Add multiple color stops, adjust angles, and copy the ready-to-use CSS code in one click.
FAQ
What is a CSS gradient?
A CSS gradient is a smooth transition between two or more colors generated by the browser — no image file needed. Use background: linear-gradient() or radial-gradient().
How do I make a gradient with transparency?
Use rgba() or hsla() colors with an alpha value less than 1, or use the keyword 'transparent' as one of the color stops.
What is the difference between linear and radial gradients?
Linear gradients transition along a straight line (e.g. top to bottom). Radial gradients radiate outward from a center point in a circle or ellipse.
Continue explorando
Outras ferramentas de Desenvolvimento que você pode gostar…
Formatador JSON
Formate, valide e minifique JSON com destaque de sintaxe e detecção de erros
Codificador/Decodificador Base64
Codifique texto ou arquivos em Base64 e decodifique strings Base64 em texto legível
Codificador/Decodificador de URL
Codifique e decodifique componentes de URL e parâmetros de query string
Gerador de UUID
Gere UUIDs aleatórios (v1, v4) ou gere múltiplos UUIDs em lote
Gerador de Hash
Gere hashes MD5, SHA-1, SHA-256, SHA-512 de texto ou arquivos
Testador de Regex
Teste expressões regulares com destaque de correspondências em tempo real
Decodificador JWT
Decodifique e inspecione JSON Web Tokens — header, payload e assinaturas
Formatador HTML
Formate e embeleze código HTML com indentação correta e destaque de sintaxe