SVG versus PNG voor logo's: welk formaat gebruik je (en wanneer)

Wat is het verschil tussen SVG en PNG?

Het verschil is vector versus raster. Een SVG (Scalable Vector Graphics) beschrijft een logo als vormen — punten, krommen, en vullingen — gedefinieerd met wiskunde. Ze wordt opnieuw getekend op elk formaat waarop ze verschijnt, dus blijft ze overal scherp. Omdat het code is, is ze ook minuscuul voor de strakke geometrie van de meeste logo's, vaak maar een paar kilobytes.

Een PNG (Portable Network Graphics) is een rasterafbeelding: een vast raster van pixels met een vaste breedte en hoogte. Ze ondersteunt transparantie, dus staat een logo strak op elke kleur — maar groter getoond dan geëxporteerd, worden de pixels uitgerekt en verzachten de randen.

Wanneer gebruik je SVG?

Maak van SVG je masterbestand en je standaard voor alles op scherm:

• Websites en webapps — het logo in de header, footer, en hero. Moderne browsers renderen SVG perfect scherp op elk scherm, inclusief retina en 4K.
• Overal waar het logo moet schalen — responsieve lay-outs en hoge-dichtheidsschermen.
• Als de enige bron waaruit je al het andere exporteert.
• Favicons, aangezien moderne browsers een SVG-favicon accepteren.

Wanneer gebruik je PNG?

Gebruik PNG wanneer je een raster met vaste grootte nodig hebt of een plek die geen SVG accepteert:

• Profielfoto's en omslagafbeeldingen op sociale media — de meeste platforms accepteren alleen rasteruploads, dus exporteer een vierkante PNG op het formaat dat elk platform aanbeveelt.
• Sommige e-mailclients en handtekeningtools die SVG niet betrouwbaar renderen.
• Documenten, presentaties, en marktplaatsen die alleen rasterafbeeldingen accepteren.
• Snelle voorbeelden en thumbnails.

SVG versus PNG in één oogopslag

Hoe zit het met EPS, PDF, AI — en JPG?

SVG en PNG dekken het web, maar een compleet logopakket bevat meestal nog een paar andere:

• PDF — een vectorformaat dat bijna elke drukker en elk kantoortool accepteert. Dit is het veiligste bestand om aan een drukkerij te geven.
• EPS — een ouder vectorformaat dat sommige drukkers nog vragen. Behandel het als een drukcompatibiliteitsexport, niet iets wat je dagelijks gebruikt.
• AI (Adobe Illustrator) — een werk-/bronbestand. Heeft een ontwerper je logo gemaakt, bewaar dan het AI-bestand (of de SVG) als het bewerkbare origineel.
• JPG — vermijd het voor logo's. JPG heeft geen transparantie, dus dwingt het een achtergrondvak rond het beeldmerk af, en de compressie ervan is lossy, wat scherpe randen uitsmeert. Het is gebouwd voor foto's, niet voor logo's.

Kun je een PNG terugzetten naar een SVG?

Niet netjes. Een PNG naar SVG converteren betekent de pixels traceren naar vormen, wat zelden overeenkomt met het origineel en vaak rommelige paden oplevert. Heb je de SVG, begin dan altijd daar. Heb je alleen een PNG met lage resolutie, dan is het meestal beter het beeldmerk als vector opnieuw te bouwen dan het automatisch te traceren.

Hoe zit het met favicons en app-icoons?

Een favicon is gewoon een zeer kleine versie van je logo, exporteer hem dus uit de SVG: een SVG-favicon voor moderne browsers, plus kleine PNG's (bijvoorbeeld 32×32 en een 180×180 Apple touch-icon) voor brede compatibiliteit. Dezelfde regel geldt voor app-icoons — genereer de formaten die elk platform vraagt vanuit de vectormaster. Zie hoe je een favicon maakt van je logo.

Het korte antwoord

Ontwerp en bewaar je logo als SVG, gebruik het op het web, exporteer PNG voor rasterplaatsingen met vaste grootte, geef drukkers een PDF of EPS, en sla JPG volledig over. Bewaar de vectormaster en je kunt later elk formaat produceren zonder kwaliteit te verliezen.

Maak een logo en exporteer SVG, PNG en favicon

Veelgestelde vragen

Is SVG beter dan PNG voor logo's?

Voor een logo meestal wel: SVG is een vector, dus blijft ze scherp op elk formaat en is ze minuscuul voor eenvoudige beeldmerken. PNG blijft nuttig voor rasterplaatsingen met vaste grootte zoals social-media-avatars en tools die geen SVG kunnen lezen.

Verliest een SVG-logo kwaliteit bij het schalen?

Nee. SVG beschrijft vormen met wiskunde, dus ze wordt op elk formaat scherp opnieuw weergegeven — van favicon tot billboard — zonder ooit wazig of gepixeleerd te worden.

Waarom oogt mijn PNG-logo wazig?

Een PNG heeft een vaste pixelgrootte. Toon je hem groter dan geëxporteerd, of op een hoge-dichtheidsscherm, dan worden die pixels uitgerekt en verzachten de randen. Exporteer een grotere PNG, of gebruik de SVG.

Moet ik JPG gebruiken voor een logo?

Nee. JPG heeft geen transparantie (dus voegt het een achtergrondvak toe) en is lossy, wat de scherpe randen van een beeldmerk uitsmeert. Gebruik SVG of PNG voor logo's, nooit JPG.

Welk formaat geef ik aan een drukker?

Een vectorbestand — meestal een PDF of EPS geëxporteerd uit je logo — zodat de drukker het strak naar elk formaat kan schalen. Bewaar de SVG als de master waaruit je die genereert.