SVG vs PNG: wat gebruik je voor logo's en iconen

Een logo als PNG is in feite een foto van dat logo: een vast raster van pixels. Een logo als SVG is de instructie om het logo te tekenen: "trek een lijn van hier naar daar, vul dit met die kleur, rond die hoek af". De browser of het programma rekent die tekening in real time om naar elke resolutie. Daarom is een SVG altijd scherp, ongeacht het formaat.

Directe vergelijking

Eigenschap	SVG	PNG
Soort formaat	Vector (XML-instructies)	Raster (pixels)
Schalen zonder verlies	✅ Oneindig	❌ Wordt korrelig bij vergroten
Transparantie	✅ Volledig	✅ Compleet alfakanaal
Geschikt voor foto's	❌ Nee	❌ Nee (gebruik JPG of WebP)
Geschikt voor eenvoudige logo's	✅ Beste keuze	✅ Werkt, maar ligt vast
Aanpasbaar met CSS en JavaScript	✅ Kleuren, animaties, interacties	❌ Nee
Bestandsgrootte (eenvoudig logo)	Heel klein (1–10 KB)	Groter (20–200 KB)
Geaccepteerd op social media	❌ Nee (de meeste platforms weigeren SVG)	✅ Overal
Geaccepteerd in e-mail	❌ Nee	✅ Ja
Geaccepteerd bij drukkerijen	✅ Ja, en zelfs favoriet	✅ Mits hoge resolutie
Geïndexeerd door Google	✅ Leesbare tekst	❌ Alleen via alt-tekst

Waarom SVG wint bij logo's op websites

Een PNG-logo van 200 pixels breed oogt scherp op een Full HD-monitor, maar wordt vaag op een 4K-scherm of een Retina-scherm van een iPhone, omdat het scherm de afbeelding met meer pixels probeert te tonen dan er zijn. Om Retina-schermen met PNG te bedienen moet je het logo op twee- of viermaal het weergaveformaat exporteren, wat het bestand zwaarder maakt.

SVG lost dat volledig op: de browser rendert het bestand in precies de resolutie van het scherm, altijd scherp en zonder aparte versies per formaat. Een eenvoudig logo van 5 KB in SVG blijft haarscherp op een telefoon van 460 ppi, op een 4K-monitor en op een billboard van tien meter.

Daar komt bij dat je een SVG met CSS en JavaScript kunt aansturen: de kleur omzetten naar een donkere modus, een animatie toevoegen bij hover, of onderdelen van het logo aanpassen aan de context, vaak met één regel CSS.

Wanneer je PNG toch nodig hebt

SVG wordt niet overal geaccepteerd. PNG blijft onmisbaar voor:

Social media: Instagram, Facebook, LinkedIn, WhatsApp en de meeste andere platforms vragen JPG of PNG voor profielfoto's en uploads.
E-mailmarketing: e-mailprogramma's renderen geen inline SVG. Een logo in een mailing hoort dus PNG te zijn.
Presentaties en documenten: PowerPoint, Word en Google Slides slikken PNG probleemloos, terwijl hun ondersteuning voor SVG beperkt of wisselend is.
Stickers en apps: WhatsApp-stickers en vergelijkbare formaten vragen expliciet om PNG.
Complexe logo's met verlopen en schaduwen: fotografische effecten in een logo, wat niet aan te raden is maar wel voorkomt, komen in SVG slecht tot hun recht.

De juiste werkwijze voor professionele logo's

In de praktijk houd je je logo in beide formaten bij de hand:

SVG: voor je website, webapplicaties, aanlevering bij drukkerijen en alles wat schaalbaar moet zijn
PNG met transparante achtergrond in hoge resolutie: voor social media, e-mail, documenten en alle plekken waar SVG niet wordt geaccepteerd

Logo Maken van ImageTools exporteert meteen in beide formaten. Heb je je logo alleen als PNG en wil je een SVG, dan kan een ontwerper het vectoriseren. De omgekeerde weg, van SVG naar PNG, is eenvoudig en regel je met Converteren.

Maak nu je logo in SVG en PNG

Logo Maken van ImageTools exporteert in beide formaten, zonder account en zonder watermerk.

Gratis logo maken

Waarom ziet mijn SVG-logo er soms wazig uit?

Een SVG is per definitie niet wazig, maar kan er wel zo uitzien als het bestand uit een raster-PNG is gegenereerd via een matige vectorisatie in plaats van als echte vector te zijn getekend. Ga daarom na of je SVG oorspronkelijk als vector is gemaakt of uit een raster is omgezet.

Is SVG veiliger dan PNG als het om auteursrecht gaat?

Nee. Auteursrecht hangt niet af van het bestandsformaat: een beschermd logo blijft beschermd, of het nu SVG, PNG of iets anders is. De verwarring ontstaat doordat een SVG leesbare tekst is en iedereen de code kan bekijken, maar dat verandert niets aan de bescherming van het werk.

Kan ik een PNG automatisch naar SVG omzetten?

Er bestaat een proces dat vectorisatie heet (raster to vector) en dat probeert van een PNG een SVG te maken. Adobe Illustrator (Image Trace), Inkscape en diverse onlinediensten doen dat. Bij eenvoudige logo's met weinig kleuren en scherpe randen is het resultaat prima; bij complexe logo's vraagt de automatische vectorisatie meestal nog handwerk.