Besplatni pretvarač

SVG u PNG Konverter

Pretvorite vektorske SVG datoteke u visokokvalitetne rasterske PNG slike. Jednostavno prilagodite izlaznu ljestvicu i boju pozadine u svom pregledniku.

Povucite i ispustite SVG ovdje

Podržava do 50 MB

Ili

O ovom alatu

SVG (Scalable Vector Graphics) opisuje slike kao skup geometrijskih primitiva — putanje, oblike, tekst, gradijente — koji se skaliraju na bilo koju veličinu bez gubitka kvalitete. PNG pohranjuje jednu pravokutnu mrežu piksela u fiksnoj razlučivosti. Pretvaranje SVG-a u PNG korak je rasterizacije: upute za crtanje SVG-a procjenjuju se u odabranoj veličini piksela, a rezultirajuća bitmapa kodira se kao PNG. Ispis izgleda jasno u veličini koju ste naveli, ali pikselizira ako se poveća.

Ovaj pretvarač prikazuje SVG koristeći SVG mehanizam ugrađen u preglednik. SVG se učitava u element slike, iscrtava na HTML5 platno u odabranim izlaznim dimenzijama i izvozi kao PNG putem canvas.toBlob. Budući da preglednik radi rasterizaciju, složene SVG značajke — gradijenti, filtri, maske, animacije kao statični okvir — prikazuju se na isti način kao na stvarnoj web stranici.

Najvažnija odluka u pretvorbi SVG-a u PNG je ciljana veličina. SVG je neovisan o razlučivosti, tako da se odabirom veličine PNG-a koja odgovara stvarnoj upotrebi izbjegava prekomjerno dodjeljivanje (ogromne datoteke za ikone veličine minijatura) i premalo davanje (mutni ispis kada se kasnije poveća). Uobičajeni ciljevi: 32 × 32 ili 64 × 64 za ikone, 256 × 256 ili 512 × 512 za logotipe, 1024 × 1024 za herojske grafike, 2048 × 2048 za materijale kvalitete mrežnice.

Zašto pretvoriti SVG u PNG

SVG je prekrasan za web i moderne alate za dizajn, ali je užasan za mnoge druge kontekste. Klijenti e-pošte prikazuju SVG nedosljedno; neki ga blokiraju kao sigurnosni rizik. Stariji uredski softver, određeni CMS-ovi, usluge trećih strana i gotovo svi kanali ispisa fotografija uopće ne prihvaćaju SVG. Pretvaranjem u PNG dobiva se univerzalno prihvaćen raster koji izgleda identično u odabranoj veličini.

PNG se također pouzdano ugrađuje u uredske dokumente, dijapozitive i PDF-ove bez ovisnosti o primateljevom SVG rendereru. Za logotipe i grafiku koji se moraju dosljedno pojavljivati ​​na mnogim platformama, PNG je sigurniji izbor — iako gubi neovisnost o razlučivosti koja SVG čini atraktivnim na prvom mjestu.

Kako koristiti

Odaberite ciljnu veličinu, renderirajte. Preglednik radi rasterizaciju.

  1. Prenesite SVG datoteku: Povucite SVG u područje za učitavanje ili kliknite za pregledavanje. Podržane su datoteke do 50 MB, iako su tipične SVG datoteke ispod 1 MB. Samostalni SVG-ovi rade najbolje; SVG-ovi koji upućuju vanjske slike putem xlink:href na udaljene URL-ove mogu se prikazati nepotpunima.
  2. Odaberite izlaznu veličinu: Zadane su SVG izvorne dimenzije viewBoxa, ali možete promijeniti bilo koju veličinu piksela. Odaberite veličinu koja odgovara vašoj stvarnoj upotrebi — izbjegavajte stvaranje 4K PNG za ikone koje će se prikazivati ​​u 32×32.
  3. Render: Preglednik analizira SVG, crta ga na platnu u traženim dimenzijama i izvozi platno kao PNG. Složeni SVG-ovi s filtrima ili velikim brojem staza mogu potrajati; jednostavne ikone prikazuju se trenutno.
  4. Preuzmite PNG: Spremite datoteku. Transparentnost u SVG (sve izvan nacrtanih oblika) čuva se kao alfa kanal u PNG.

Uobičajeni slučajevi upotrebe

Tehnički detalji

SVG (W3C Recommendation) je vektorski format temeljen na XML-u s elementima za staze, osnovne oblike (pravocrt, krug, elipsa, linija, poligon, polilinija), tekst, gradijente (linearniGradient, radijalniGradient), filtre, maske i putanje isječaka. Preglednik analizira XML, gradi DOM, primjenjuje CSS i rasterizira rezultat tijekom renderiranja stranice.

Ovaj pretvarač učitava SVG u HTMLImageElement (koji pokreće uobičajeni put renderiranja SVG-a kao slike u pregledniku), zatim ga crta na platnu putem drawImage-a. Platno se izvozi kao PNG pomoću canvas.toBlob('image/png'). Točni pikseli u izlazu odgovaraju onome što bi SVG prikazao u istoj veličini na kartici preglednika.

Rubni slučajevi: SVG koji koristi ForeignObject nije uvijek podržan kada se koristi putem elementa slike. SVG koji upućuje na vanjske resurse (xlink:href na drugu domenu) možda se neće moći učitati zbog CORS-a. SMIL animacije i animacije vođene JavaScriptom prikazuju se samo kao početni okvir.

Najbolji primjeri iz prakse

Često postavljana pitanja

Hoće li moj SVG izgubiti kvalitetu kada se pretvori u PNG?
Konverzija vektora u raster znači da se slika temelji na pikselima i više se ne može beskonačno skalirati. Odaberite visoku razlučivost kako biste osigurali da PNG izgleda oštro na željenoj veličini prikaza.
Za što se koristi PNG format?
PNG (Portable Network Graphics) prvenstveno se koristi za grafike s prozirnošću, snimke zaslona, logotipe, ikone.
Postoje li neka ograničenja kojih treba biti svjestan?
Podržane su datoteke do 50 MB. Obrada vrlo velikih ili složenih datoteka može potrajati dulje. Sve pretvorbe odvijaju se u vašem pregledniku, tako da brzina obrade ovisi o vašem uređaju.
Jesu li moje slike privatne tijekom pretvorbe?
da Vaše SVG datoteke u potpunosti se obrađuju unutar vašeg preglednika pomoću Canvas API-ja i JavaScripta. Ništa se ne učitava ni na jedan poslužitelj — datoteka ide izravno s vašeg uređaja u pretvarač i natrag na vaš uređaj.
Je li tekst prikazan kao tekst ili kao staze?
Tekst je rasteriziran kao pikseli u izlaznom PNG-u. Izlaz se više ne može pretraživati ​​niti odabrati. Ako vaš SVG koristi fontove koji nisu dostupni u pregledniku, tekst se može prikazati u rezervnom fontu; pretvorite tekst u staze u SVG prije iscrtavanja za zajamčeni izgled.
Je li moj SVG prenesen na poslužitelj?
Ne. SVG raščlanjivanje i renderiranje događa se u vašem pregledniku; PNG kodiranje se događa u vašem pregledniku. Datoteka ne napušta vaš uređaj.
Zašto je moj konvertirani PNG prazan?
Uobičajeni uzroci: SVG upućuje na vanjske slike koje se nisu uspjele učitati zbog CORS-a; SVG koristi značajke koje ne podržava put renderiranja elementa slike (strani objekt, određeni filtri); SVG ima nulti dimenzionalni viewBox. Otvorite SVG izravno u pregledniku kako biste potvrdili da se prikazuje prije pretvaranja.
Mogu li pretvoriti SVG u PNG u skripti?
Da — za skupne poslove, postava Node.js pomoću Sharp ili Puppeteer renderira SVG u PNG sa sličnom vjernošću pregledniku. Ovaj je alat za jednokratne konverzije u pregledniku bez instaliranja bilo čega.