Gör om skalbara SVG-vektorer till användarklara PNG-bilder
En SVG-fil är en uppsättning instruktioner, inte en färdig bild. Öppna en i en textredigerare och du hittar XML som beskriver banor, former, fyllningar och kurvor — ett recept en webbläsare följer för att rita om konstverket från grunden i vilken storlek du än begär. En PNG är motsatsen: ett rutnät av färgade pixlar frusna vid en fast bredd och höjd. Att konvertera det ena till det andra kallas rastrering, och det här verktyget gör det helt i din webbläsare. Du väljer en utstorlek, SVG:n målas upp på en HTML-canvas, och en PNG kommer tillbaka — ingen fil lämnar någonsin din enhet.
Vektor kontra raster, i vanlig text
Kärnskillnaden är hur upplösning hanteras. Eftersom SVG lagrar matematik istället för pixlar är den upplösningsoberoende: skala en logotyp från en favikon till en reklamskylt och varje kant räknas om för att förbli matematiskt skarp. En PNG har ingen sådan frihet. Dess pixlar är inbakade, så att förstora den bortom dess ursprungliga storlek tvingar betraktaren att sträcka ut befintliga punkter, och du börjar se den oskärpa och trappstegseffekt som avslöjar rasterbilder.
Den avvägningen går åt båda hållen. Vektorer är oslagbara för logotyper, ikoner och platt illustration gjord av rena former, och filerna är vanligtvis mycket små. Rasterformat som PNG hanterar toningar, mjuka skuggor och fotografisk detalj mer naturligt, och — avgörande — de förstås av praktiskt taget allt. När du rastrerar byter du bort SVG:ns oändliga skalbarhet mot PNG:ns universella kompatibilitet vid en vald storlek.
Varför överhuvudtaget rastrera en SVG?
Om SVG skalar så vackert, varför konvertera? Kompatibilitet är det vanliga svaret. Många ställen accepterar helt enkelt inte SVG: många e-postklienter tar bort eller vägrar rendera den, dokumentredigerare och presentationsprogram vill ofta ha en platt bild, marknadsplatser och annonsnätverk kräver PNG eller JPG, och de flesta sociala plattformar ignorerar vektoruppladdningar helt. Vissa innehållssystem blockerar också SVG rakt av av säkerhetsskäl, eftersom formatet kan bädda in skript.
Det andra skälet är att du ibland vill ha en resurs med fast storlek. Appikoner, miniatyrbilder, Open Graph-förhandsvisningsbilder och tryckt material förväntar sig alla exakta pixelmått. En PNG låser konstverket till det målet så att det renderas identiskt överallt, utan överraskningar från en visare som tolkar vektorn annorlunda. Att konvertera din käll-SVG till de exakta storlekar en plattform kräver är ofta den renaste vägen till ett konsekvent resultat.
Att välja rätt exportupplösning
Eftersom en PNG inte kan skala upp elegant spelar storleken du exporterar i större roll än med någon vektor. Exportera för litet och bilden ser mjuk ut på moderna skärmar; exportera onödigt stort och du slösar bandbredd. En enkel tumregel: bestäm den största storlek bilden någonsin kommer visas i, rendera då minst det, och gärna mer för högtäthetsskärmar.
Vanliga skärmar klarar sig fint vid 1x — konstverkets nominella storlek. Hög-DPI- och Retina-skärmar packar ungefär dubbelt så många pixlar på samma yta, så en 2x-export håller ikoner och grafik skarpa istället för suddiga. För tryck, affischer eller mycket stora skärmar ger 3x eller 4x dig marginal. Eftersom källan är en vektor kostar en större export inget i kvalitet — kurvorna räknas helt enkelt om vid det högre pixelantalet innan de plattas ut. Är du osäker, rendera generöst; du kan alltid skala ner en stor PNG, men du kan aldrig återfå detalj genom att skala upp en liten.
Transparensen följer med
PNG stöder en fullständig alfakanal, vilket betyder att transparens överlever konverteringen. Om din SVG saknar bakgrundsfyllning behåller den resulterande PNG:n de områdena genomskinliga, så en logotyp eller ikon landar rent på vilken färg som helst utan en ful vit ruta runt om. Om du istället behöver en solid bakgrund, ge SVG:n en innan konvertering. Oavsett vad, det du ser i vektorn är vad PNG:n kommer bevara, vilket är precis varför PNG — snarare än JPG — är det naturliga målet för ikoner, märken och överlägg.
Allt stannar på din enhet
Den här konverteraren körs som lokal kod i din webbläsare med hjälp av canvas-API:et. Din SVG läses, ritas och exporteras utan att någonsin skickas till en server, så det finns ingen uppladdning, ingen kö och ingen kopia av ditt konstverk som ligger i någon annans lagring. Det är snabbare för dig och säkrare för allt du hellre inte vill lämna till en tredje part, från icke-lanserad varumärkning till interna diagram. När du är klar här, utforska resten av våra bildverktyg — bygger du en Windows- eller favikon-resurs är konverteraren PNG till ICO ett naturligt nästa steg.
Vanliga frågor
Kommer PNG:n att se lika skarp ut som SVG:n?
Vid storleken du exporterar i, ja. Eftersom vektorn renderas på nytt vid din valda upplösning förblir kanterna skarpa. Skillnaden är att PNG:n inte kan förstoras efteråt utan att bli mjukare, medan den ursprungliga SVG:n alltid kunde det.
Bevarar konverteringen transparens?
Ja. PNG har en alfakanal, så alla transparenta områden i din SVG förblir transparenta i PNG:n. Lägg till en bakgrund i SVG:n först om du vill ha en solid fyllning istället.
Vilken upplösning ska jag välja?
Matcha eller överstig den största storlek bilden kommer visas i. Använd 1x för vanliga skärmar, 2x för Retina- och hög-DPI-skärmar, och 3x eller 4x för tryck eller extra stor grafik. Att rendera större kostar inget i kvalitet eftersom källan är en vektor.
Varför inte bara använda SVG:n överallt?
Många e-postklienter, dokumentredigerare, marknadsplatser och sociala plattformar accepterar eller renderar inte SVG tillförlitligt. En PNG fungerar nästan överallt och låser konstverket till en förutsägbar, fast storlek.
Laddas mina filer upp någonstans?
Nej. Allt körs lokalt i din webbläsare. Din SVG skickas aldrig till en server, så ingenting laddas upp, lagras eller spåras.
Kan jag konvertera PNG:n tillbaka till en SVG?
Inte troget. Rastrering slänger bort den ursprungliga matematiken, så att gå tillbaka innebär att spåra pixlarna till nya vektorbanor, vilket sällan matchar källan. Behåll din ursprungliga SVG som huvudfil.