Verwerk tot 200 afbeeldingen per taak – kies één keer je instellingen, voer ze allemaal uit.
Kies twee of meer kleuren, sleep de gradient naar wens, kopieer de CSS. Of download als PNG om te gebruiken als achtergrond, een dia-achtergrond of een social-post-achtergrond. Lineaire, radiale en conische gradiënten worden ondersteund, plus een mesh-gradientmodus voor de zachte Apple-achtige achtergronden die je in moderne UI's ziet.
Gradienttypen uitgelegd
- Lineair: rechte lijn van kleur A naar kleur B. Richtingskiezer (boven→onder, diagonaal, enz.).
- Radiaal: concentrisch — kleur A in het midden vervagend naar kleur B aan de randen. Handig voor spotlight-effecten.
- Conisch: draait rond een middelpunt zoals een kleurenwiel. Trendy in modern UI-ontwerp.
- Mesh (premium): meerdere kleurvlekken die vloeiend overvloeien. De "Apple-gradient" look.
Wat je kunt kopiëren
- CSS: klaar om te plakken
linear-gradient(...) of background-image: declaratie.
- Tailwind: de dichtstbijzijnde
bg-gradient-* klasse plus eventuele aangepaste kleurtoevoegingen.
- SVG: voor schaalbaar gebruik in iconen of UI-graphics.
- PNG-download: elk formaat, inclusief telefoonachtergrond (1284×2778), desktop (3840×2160) en vierkant (1080×1080).
Veelvoorkomende gebruikssituaties
- Telefoonachtergronden: mesh-gradiënten zijn enorm op iOS. Probeer onze iPhone Wallpaper Preview om te testen.
- Social-post-achtergronden: direct een merklook voor quote-graphics.
- Hero-secties: gradientachtergronden zijn overal op landingspagina's.
- Diapresentaties: vervang saaie effen achtergronden.
Kleuren kiezen die werken
Aangrenzend op de kleurencirkel = subtiel, harmonieus. Tegenovergesteld = gedurfd, aandacht trekkend. Voeg een derde middenstop toe om een grote kloof te overbruggen. Voor merktrouwe gradiënten, plak je merk-HEX en kies een tint of schaduw voor de tweede stop. Gebruik onze Kleurconverter om tinten (HSL met hogere helderheid) of schaduwen (lager) te vinden.
Veelgestelde vragen
Kan ik deze in productie gebruiken?
Ja — de gekopieerde CSS werkt in elke moderne browser. SVG-fallback wordt geboden voor oudere doelen.
Hoe zit het met browserondersteuning voor radiale gradiënten?
Universeel in moderne browsers. De CSS-syntax is één regel.
Hoe groot kan ik de PNG exporteren?
Gratis: tot 4K (3840×2160). Premium: 8K en verder.
Zijn mesh-gradiënten moeilijk te gebruiken?
Op het web zijn ze gebaseerd op SVG of canvas. We geven u een afgevlakt PNG voor eenvoudig gebruik, plus de SVG-bron voor bewerking.
Kan ik mijn verlopen opslaan?
Meld je aan (gratis) en opgeslagen verlopen verschijnen in je bibliotheek.
Wat is een 'conische' gradiënt?
Loopt rond een punt — zoals een kleurenwiel of een taartdiagram. Moderne CSS ondersteunt het standaard.
Werkt het voor geanimeerde verloopkleuren?
Alleen statische export. Kopieer voor geanimeerde achtergronden de CSS en voeg een CSS-animatie toe rond de verloophoek.
Waarom niet gewoon CSS met de hand schrijven?
Dat kan — de tool maakt de visuele iteratie alleen sneller. Kopieer en pas aan.
Over Gradientgenerator
Gradientgenerator is een gratis online tool van Wallpapers.com die volledig in je browser draait — geen installatie, geen watermerk, geen e-mailregistratie voor de eerste poging.
Bouw lineaire of radiale gradiënten met copy-paste CSS-output.
Hoe te gebruiken Gradientgenerator
- Kies een kleur uit het staal of plak een HEX / RGB-waarde.
- Pas de uitvoer aan — palet, contrast, complementaire kleuren.
- Kopieer de waarde, of exporteer het staal als JSON.
Wanneer te gebruiken
Veelvoorkomende toepassingen zijn:
afbeeldingen voorbereiden voor webupload, e-commerce lijsten, social media platforms met formaatbeperkingen, en bestanden converteren van het ene apparaat of app naar het andere.
Gratis vs Premium
Elke bezoeker krijgt een gratis proefbeurt; ingelogde gratis gebruikers krijgen een hoger dagelijks quotum. Abonneer je op
Premium
voor onbeperkt gebruik, bulkverwerking tot 200 afbeeldingen per taak, prioriteitswachtrij, en advertentievrij browsen.
Gerelateerde tools
Op zoek naar iets anders? Probeer de
Kleurenkiezer uit Afbeelding
,
Palettextractor
of
Grijswaardenconverter
— of blader door alles
Kleurgereedschappen tools.
