Icoon generator voor SVG en PNG

Kies een icoon, pas de kleuren en het formaat aan en download het gratis als SVG of PNG.

Achtergrond van het voorbeeld
Animatie
0 iconen
Kies een icoon

Zo gebruik je de icoon generator

De icoon generator is een gratis online tool waarmee je iconen zoekt, aanpast en downloadt voor websites, applicaties, presentaties en designprojecten. Geen account, geen installatie — alles werkt rechtstreeks in je browser.

Iconen zoeken en selecteren

Gebruik het zoekveld of blader door de categorieën in het linkerpaneel om het juiste icoon te vinden. De bibliotheek bevat honderden iconen, geordend per thema, zodat je snel symbolen vindt voor interfaces, social media, technologie, zakelijke onderwerpen en veel meer. Klik op een icoon om het te selecteren en het meteen in het aanpaspaneel te bekijken.

Het icoon aanpassen

Heb je een icoon gekozen, dan kun je de hoofdkleur e a secundaire kleur aanpassen zodat het icoon bij de uitstraling van je project past. Je kunt ook de formaat in pixels en de lijndikteinstellen, zodat het icoon precies in je ontwerp past — of dat nu een strakke interface is of een design met wat meer visueel gewicht.

Het icoon downloaden of kopiëren

Ben je klaar met aanpassen, dan heb je drie manieren om te exporteren:

Met die opties bedient de generator zowel ontwikkelaars die iconen rechtstreeks in hun code zetten als designers die kant-en-klare bestanden nodig hebben voor Figma, Canva of PowerPoint.

Veelgestelde vragen

Mag ik de iconen gratis commercieel gebruiken?
Ja. Alle iconen in deze tool mag je vrij gebruiken, ook in commerciële projecten. Naamsvermelding is niet nodig.
Wat is het verschil tussen downloaden als SVG en als PNG?
SVG is een vectorformaat dat je naar elk formaat kunt schalen zonder kwaliteitsverlies. Ideaal voor websites en applicaties. PNG is een rasterafbeelding met een vast formaat — handiger voor documenten, presentaties en platforms die geen SVG ondersteunen.
Kan ik de iconen rechtstreeks in mijn HTML gebruiken?
Ja. Gebruik de knop "SVG-code kopiëren" om de broncode te kopiëren en rechtstreeks in je HTML te plakken. Zo kun je de iconen met CSS opmaken en met JavaScript aansturen.
Wat is de secundaire kleur?
Sommige iconen bestaan uit twee lagen of losse onderdelen. De secundaire kleur wordt op die onderdelen toegepast — een binnenvlak, schaduwen of extra details. Bij iconen met een enkele lijn wordt alleen de hoofdkleur gebruikt.
Ga verder met een andere tool
Gerelateerde artikelen
Bekijk alle artikelen →