UltKit

SVG na ikoon-omskakelaar

Een vektorlogo kan elke ikoonplek vul wat u het: 'n favicon, 'n Windows-kortpad, 'n Mac-toep en die lanseerderikone op fone. Hierdie bladsy begin met 'n ICO met veelvuldige groottes en laat u na ICNS of PNG oorskakel vir die ander platforms.

Beeldomskakelaar

of los JPG, JPEG, JPE …-lêers hier ·

Maks. 95 MB per lêer· Tot 20 lêers· Uitgevee na 30 minute

Uitvoer

Lêers word op ons bedieners verwerk en na 30 minute uitgevee.

Hoe om hierdie nutsding te gebruik

  1. 1

    Laai 'n vierkantige SVG op

    Voeg die SVG van jou embleem by, verkieslik met 'n vierkantige viewBox. Jy kan tot 20 lêers gelyktydig byvoeg, byvoorbeeld 'n ligte en 'n donker weergawe.

  2. 2

    Kies die ikoonformaat

    ICO met Ikoongroottes op Alle groottes (16–256) is vooraf gekies. Kies ICNS onder Skakel om na vir macOS, of PNG met 'n wydte onder Verander grootte van uitvoerbeeld vir 'n foon- of winkelikoon.

  3. 3

    Skakel om en plaas die lêers

    Druk Skakel om na ICO (die etiket volg die formaat wat jy gekies het), laai af, en plaas elke lêer waar sy platform dit verwag.

Daar is nie een enkele ikoonformaat nie. Windows en blaaiers gebruik ICO, macOS gebruik ICNS, en foons gebruik stelle PNG's. As jy met SVG begin, word elkeen vars uit die vektor geteken, skerp by elke grootte.

SVG na ikoon: een vektor, drie soorte ikoonlêers

'n Ikoonlêer is 'n houer van klein bitmappe, nie 'n vektor nie. Die bedryfstelsel kies die bitmap wat die naaste is aan die grootte wat dit nodig het, so 'n goeie ikoon het verskeie, elk vir sy eie rooster geteken.

Die ICO-voorinstelling op hierdie bladsy skryf een lêer met elke grootte van 16 tot 256 px, wat favicon.ico en Windows-kortpaaie dek. Verander Skakel om na na ICNS vir 'n Apple-ikoonhouer, of na PNG vir die enkele groottes wat Android, iOS en toepassingwinkels vra.

Die tabel lys wat groot platforms vir hul ikoonplekke publiseer.

Ikoonlêers wat elke platform verwag
OrganisasieVereisteBron
Windows-lessenaar en taakbalkICO met verskeie groottes, insluitend 16, 32, 48 en 256 px—
Webwerf-faviconfavicon.ico in die webwerfwortel met 16, 32 en 48 px; 'n 180 × 180 px PNG vir apple-touch-icon—
macOS-toepassingikoonICNS of Xcode-bateleergids, groottes tot 1024 × 1024 px—
Google Play-winkellys512 × 512 px 32-bis PNG, tot 1 024 KB—
Apple App Store1024 × 1024 px PNG sonder deursigtigheid—

SVG

Scalable Vector Graphics

SVG is 'n XML-gebaseerde vektorformaat wat die W3C in 2001 gestandaardiseer het. In plaas van pixels beskryf dit vorms, paaie en teks, so dit bly skerp op enige grootte en is gewoonlik piepklein vir logo's en ikone. Dit ondersteun deursigtigheid, CSS-stileer, skripte en animasie, en elke blaaier lewer dit inheems. SVG is ongeskik vir foto's, en komplekse illustrasies kan stadig word om te lewer. Illustrator, Inkscape, Figma en blaaiers kan dit oopmaak en redigeer.

Kompressie
–
Deursigtigheid
Ja
Animasie
Ja
Bekendgestel
2001 · W3C
SVG-omskakelaar

ICO

Windows-ikoon

ICO is die Microsoft-ikoonformaat wat vir Windows-programikone en webwerf-favicons gebruik word. Een .ico-lêer kan verskeie beelde in verskillende groottes bevat, soos 16×16, 32×32, 48×48 en 256×256 piksels, sodat die stelsel die beste pasmaat kan kies. Elke beeld kan as 'n bitmap of as PNG-data gestoor word en ondersteun volle alfa-deursigtigheid. ICO is nie bedoel vir foto's of groot kunswerk nie. Blaaiers, Windows en die meeste ikoonredigeerders kan dit lees.

Kompressie
Verliesloos
Deursigtigheid
Ja
Animasie
Nee
Bekendgestel
Microsoft
ICO-omskakelaar

Mense soek na SVG na ikoon wanneer hulle een vektorlogo en verskeie platforms het om te bedien, elk met sy eie ikoonhouer, van favicon.ico op 'n webwerf tot ICNS op 'n Mac en PNG's van vaste grootte in toepassingwinkels.

Skakel SVG om na ikoonlêers vir Windows, Mac, Android en iOS

Hou ICO en Ikoongroottes op Alle groottes. Hernoem die resultaat na favicon.ico vir 'n webwerfwortel, of wys die Verander ikoon-dialoog van 'n Windows-kortpad daarheen.

  • Een .ico dien oortjies, boekmerke en die taakbalk
  • Voeg 'n 180 px PNG by vir iPhone-tuisskermboekmerke

Ontwerp 'n SVG wat 16 px oorleef

'n 16 × 16 px-ikoon het altesaam 256 piksels. Die meeste handelsmerke hou 'n aparte ikoonmerk, dikwels net die simbool of een letter, met growwe vorms en min kleure; as joune nog nie bestaan nie, maak 'n vereenvoudigde kopie van die SVG vir ikone.

Gaan die viewBox na voor jy omskakel. 'n Breë viewBox lewer 'n ikoon met leë stroke bo en onder die merk, so sny dit eers vierkantig; die gids oor hoe om 'n beeld na 'n verhouding uit te sny dek vierkantige snitte, en SVG na PNG gee 'n vinnige groot voorskou om die ontwerp te beoordeel.

Gereelde vrae oor SVG na ikoon

Wat is die verskil tussen hierdie bladsy en SVG na ICO?

SVG na ICO fokus op die enkele .ico-lêer vir favicons en Windows. Hierdie bladsy dek elke plek waar 'n ikoon gebruik word, insluitend macOS ICNS en die PNG's van vaste grootte wat Android, iOS en toepassingwinkels vra.

Watter ikoonformaat gebruik elke bedryfstelsel?

Windows lees ICO, macOS lees ICNS of bateleergidse wat in Xcode gebou is, en Android en iOS neem PNG-beelde wat teen vaste pikselgroottes verskaf word.

Kan ek elke PNG-grootte vir my toep in een omskakeling kry?

Nee. 'n PNG hou een grootte, so elke omskakeling skryf een wydte. Stel Verander grootte van uitvoerbeeld op een grootte, skakel om, verander dan die getal en skakel weer om; elke grootte word skerp uit die vektor geteken.

Dek die ICNS van hierdie bladsy Retina-Mac-ikone?

Dit bevat groottes van 16 tot 256 px. Huidige macOS-toepassingikone bevat ook 512 px- en 1024 px-inskrywings vir Retina-skerms, wat Xcode of Apple se iconutil uit PNG's bou; voer daardie twee hier as PNG uit en voeg hulle by die stel.

Moet die ikoon 'n deursigtige agtergrond behou?

Vir ICO, ICNS en Android-lanseerderlae, ja: deursigtigheid laat die stelsel sy eie agtergrond teken. Die iOS App Store-ikoon is die uitsondering; Apple verwerp 'n 1024 px-bemarkingsikoon met 'n alfakanaal, so gee daardie PNG 'n soliede agtergrond in die SVG.

Waarom word my gedetailleerde logo 'n klad as 'n klein ikoon?

By 16 of 32 px is daar geen plek vir dun lyne of klein teks nie. Maak lyne dikker sodat hulle by die kleinste grootte minstens een volle piksel bedek, en laat die woordmerk weg.