Bilde til SVG – vektorisering

Slik konverterer du et bilde til SVG

1. Slipp et PNG-, JPG-, WebP- eller GIF-bilde i dropsonen, eller klikk på den for å velge ett. Originalen vises til venstre.
2. Velg et Forhåndsvalg: - Logo (flate farger, rene former) for logoer, ikoner, stempler og flate illustrasjoner; - Detaljert (flere farger og baner) for tegninger med skyggelegging eller mange farger; - Posterisert (4 glattede farger) for et stilisert, plakatlignende resultat fra et foto.
3. Juster Antall farger (2 til 64) og Ignorer flekker mindre enn (px) ved behov. Forhåndsvalget fyller inn fornuftige verdier for begge.
4. Velg en Arbeidsstørrelse (lengste side). Bildet spores i den størrelsen, mens selve SVG-en beholder de opprinnelige dimensjonene.
5. Klikk på Spor til SVG. Resultatet vises til høyre med filstørrelse, antall baner og farger og hvor lang tid sporingen tok.
6. Klikk på Last ned SVG, eller Kopier SVG-kode for å lime inn koden i HTML-en din eller i designverktøyet ditt.

Slik fungerer sporingen

Dette verktøyet bruker imagetracerjs, et åpen kildekode-sporingsprogram, i tre trinn:

1. Fargekvantisering: bildet reduseres til antallet farger du har valgt. Hver piksel tildeles den nærmeste fargen i paletten, og paletten finjusteres over flere runder.
2. Kantdeteksjon: for hver farge følges omrissene av alle områder med den fargen, også hull (som innsiden av en «O»).
3. Banetilpasning: omrissene forenkles til rette linjer og kvadratiske kurver, som blir <path>-elementer i SVG-en.

Områder som er mindre enn terskelen Ignorer flekker mindre enn (px), fjernes, noe som tar bort støy og JPG-artefakter. Verdien 0 beholder alt, 8 til 20 passer for logoer, og større verdier gir en renere, men enklere tegning. Helt gjennomsiktige områder fjernes, slik at en logo på gjennomsiktig bakgrunn forblir gjennomsiktig.

Hva gir gode resultater

Sporing fungerer best på enkle logoer og tegninger: få flate farger, tydelige kanter og ingen gradienter. En skannet skisse, en svart-hvit signatur eller et pikselkunst-ikon spores veldig bra med 2 til 8 farger.

Foto er en annen sak. Et foto inneholder tusenvis av subtile toner, så en tro vektorversjon krever mange farger og titusenvis av baner, og SVG-en blir mye tyngre enn JPG-en. Bruk Posterisert (4 glattede farger) for en kunstnerisk effekt i stedet, og ikke forvent et fotografisk resultat. Hvis SVG-en blir svært stor, advarer verktøyet deg.

Tips for en renere logo:

• start med den største og skarpeste versjonen av bildet du har;
• sett Antall farger til det faktiske antallet farger i logoen (bakgrunnen medregnet);
• øk flekkgrensen hvis du ser små prikker langs kantene.

Personvern og trygg forhåndsvisning

Bildet spores i nettleseren din og lastes aldri opp. SVG-forhåndsvisningen vises som et vanlig bilde fra en privat blob-adresse og settes aldri inn i siden, så selv en uvanlig fil kan ikke kjøre kode.