Over deze tool
Wat is de CSS Gradient Generator?
Bouw CSS-verlopen met een live voorbeeld. Kies het type (lineair, radiaal, conisch), voeg onbeperkt kleurstops toe, stel de hoek in (of de positie voor radiaal) en kopieer de gegenereerde CSS. De uitvoer ondersteunt alle moderne browsers; voor oudere browsers voegen we leverancierspecifieke fallbacks toe.
Ontwerpers gebruiken dit voor hero-achtergronden, knopstijlen en verkenningen van merksfeer. Uitvoer als CSS, Tailwind-klassen of SVG.
FAQ · CSS GRADIENT GENERATOR
Vragen over de CSS Gradient Generator
Welke verloptypen worden ondersteund?
Lineair (het meest gebruikelijk — op basis van een hoek), radiaal (cirkelvormig of elliptisch, positioneerbaar) en conisch (het nieuwste type — laat kleuren rond een middelpunt draaien, geweldig voor taartdiagramachtige ontwerpen). Alles wordt uitgevoerd als standaard CSS.
Kan ik exporteren naar Tailwind?
Ja — naast de ruwe CSS voert de generator Tailwind-utilityklassen uit (bijv. `bg-gradient-to-br from-blue-500 via-purple-500 to-pink-500`) wanneer de kleurstops toevallig overeenkomen met de benoemde Tailwind-palet.
Gratis?
Ja — geen registratie nodig, draait in de browser.