SVG-PNG-muunnin

SVG on vektorimuoto: se kuvaa muotoja ja polkuja matematiikassa, joten se skaalautuu mihin tahansa kokoon laadun heikkenemättä – mutta tämä tarkoittaa myös sitä, että useimmat paikat, jotka odottavat tavallista kuvaa (sähköpostin allekirjoitus, faviconin latausohjelma, tulostusmalli, vanhempi sisällönhallintajärjestelmä tai chat-sovellus), eivät hyväksy sitä. PNG-muotoon muuntaminen leikkaa vektorikuvan kiinteäksi pikseliruudukoksi, jonka mikä tahansa ohjelma, kamerarulla tai latauslomake voi avata. Tämä työkalu tekee juuri tuon rasterointivaiheen kokonaan omalla laitteellasi.

Muunnos tapahtuu kahdessa osassa: ensin selain lukee SVG:n ilmoitetun leveyden, korkeuden ja viewBoxin selvittääkseen sen luonnolliset mittasuhteet, sitten se piirtää vektorikuvan HTML-kankaalle, jonka koko on haluamasi resoluutio. Koska lähde pysyy vektorina viimeiseen arvoon asti, logo voidaan renderöidä 64 pikselillä tai 6 400 pikselillä samoilla terävillä reunoilla – ei ole keskimääräistä matalaresoluutioista bittikarttaa, joka sumentuu skaalattaessa, toisin kuin olemassa olevan JPG- tai PNG-tiedoston koon muuttaminen.

Käyttöliittymä- ja sovelluskuvakkeita tarvitaan lähes aina useammalla kuin yhden pikselin tiheydellä, joten työkalu renderöi 1x, 2x ja 3x versiot tavoitekoosta yhdellä kertaa ja antaa jokaiselle oman latauspainikkeen – sama kolmikerroksinen malli, jota iOS-sisältöluettelot, Android-piirustukset ja modernit responsiiviset verkkokuvat (srcset) käyttävät. Valitse perusleveys kerran ja hanki kaikki kolme tiedostoa sen sijaan, että suoritat muunnoksen kolme kertaa eri numeroilla.

Taustakäsittely on todellinen, toimiva valinta kosmeettisen valintaruudun sijaan: jätä se läpinäkyväksi, jos haluat säilyttää alfakanavan logoille ja kuvakkeille, joiden on oltava muun sisällön päällä, tai täytä se valitsemallasi yhtenäisellä värillä, kun kohde (pikkukuva, sosiaalinen esikatselukuva, vanhempi muoto, joka käsittelee läpinäkyvyyttä väärin) tarvitsee läpinäkymättömän taustan. Mitään ei ladata palvelimelle missään vaiheessa – SVG-teksti jäsennetään, rasteroidaan ja koodataan PNG-muotoon kokonaan selaimen välilehdessä.