UltKit

Konverter SVG til ikon

Én vektorlogo kan dekke alle ikonplassene du har: favicon, snarvei i Windows, Mac-app og app-ikoner på mobilen. Denne siden starter med en ICO i flere størrelser, og du kan bytte til ICNS eller PNG for de andre plattformene.

Bildekonverterer

eller slipp JPG, JPEG, JPE …-filer her ·

Maks 95 MB per fil· Opptil 20 filer· Slettes etter 30 minutter

Utdata

Filene behandles på serverne våre og slettes etter 30 minutter.

Slik bruker du dette verktøyet

  1. 1

    Last opp en kvadratisk SVG

    Legg til SVG-en med merket ditt, helst med kvadratisk viewBox. Du kan legge til opptil 20 filer samtidig, for eksempel en lys og en mørk variant.

  2. 2

    Velg ikonformat

    ICO med Ikonstørrelser satt til Alle størrelser (16–256) er forhåndsvalgt. Velg ICNS under Konverter til for macOS, eller PNG med en bredde under Endre størrelse på det ferdige bildet for et telefon- eller butikkikon.

  3. 3

    Konverter og plasser filene

    Trykk Konverter til ICO (teksten følger formatet du valgte), last ned, og legg hver fil der plattformen forventer den.

Det finnes ikke ett enkelt ikonformat. Windows og nettlesere bruker ICO, macOS bruker ICNS, og telefoner bruker sett med PNG-er. Når du starter fra SVG, tegnes hver av dem på nytt fra vektoren, skarpt i hver størrelse.

SVG til ikon: én vektor, tre typer ikonfiler

En ikonfil er en beholder med små punktgrafikkbilder, ikke en vektor. Operativsystemet velger bildet som ligger nærmest størrelsen det trenger, så et godt ikon har flere, hver tegnet for sitt eget rutenett.

ICO-forhåndsvalget på denne siden skriver én fil med alle størrelser fra 16 til 256 px, som dekker favicon.ico og Windows-snarveier. Bytt Konverter til til ICNS for en Apple-ikonbeholder, eller til PNG for enkeltstørrelsene som Android, iOS og appbutikker krever.

Tabellen viser hva de største plattformene oppgir for ikonplassene sine.

Ikonfiler hver plattform forventer
OrganisasjonKravKilde
Windows-skrivebord og oppgavelinjeICO med flere størrelser, inkludert 16, 32, 48 og 256 px—
Favikon for nettstedfavicon.ico i nettstedets rot med 16, 32 og 48 px; en PNG på 180 × 180 px for apple-touch-icon—
macOS-appikonICNS eller Xcode-ressurskatalog, størrelser opp til 1024 × 1024 px—
Google Play-oppføring512 × 512 px 32-biters PNG, opptil 1 024 KB—
Apple App Store1024 × 1024 px PNG uten gjennomsiktighet—

SVG

Scalable Vector Graphics

SVG er et XML-basert vektorformat standardisert av W3C i 2001. I stedet for piksler beskriver det former, baner og tekst, så det forblir skarpt i alle størrelser og er vanligvis bitteliten for logoer og ikoner. Det støtter gjennomsiktighet, CSS-stiler, skripting og animasjon, og alle nettlesere gjengir det direkte. SVG egner seg ikke for fotografier, og komplekse illustrasjoner kan bli trege å gjengi. Illustrator, Inkscape, Figma og nettlesere kan åpne og redigere det.

Komprimering
–
Gjennomsiktighet
Ja
Animasjon
Ja
Introdusert
2001 · W3C
SVG-konverterer

ICO

Windows-ikon

ICO er Microsofts ikonformat, brukt til programikoner i Windows og favicons på nettsteder. Én .ico-fil kan inneholde flere bilder i ulike størrelser, for eksempel 16×16, 32×32, 48×48 og 256×256 piksler, slik at systemet kan velge den som passer best. Hvert bilde kan lagres som bitmap eller som PNG-data og støtter full alfa-gjennomsiktighet. ICO er ikke ment for bilder eller stor grafikk. Nettlesere, Windows og de fleste ikonredigerere kan lese det.

Komprimering
Tapsfri
Gjennomsiktighet
Ja
Animasjon
Nei
Introdusert
Microsoft
ICO-konverterer

Folk søker etter SVG til ikon når de har én vektorlogo og flere plattformer å dekke, hver med sin egen ikonbeholder, fra favicon.ico på en nettside til ICNS på en Mac og PNG-er i faste størrelser i appbutikker.

Konverter SVG til ikonfiler for Windows, Mac, Android og iOS

Behold ICO og Ikonstørrelser på Alle størrelser. Gi resultatet navnet favicon.ico for roten av et nettsted, eller pek til det i dialogen Endre ikon for en Windows-snarvei.

  • Én .ico dekker faner, bokmerker og oppgavelinjen
  • Legg til en PNG på 180 px for bokmerker på iPhones hjemskjerm

Slik lager du en SVG som tåler 16 px

Et ikon på 16 × 16 px har til sammen 256 piksler. De fleste merkevarer har et eget ikonmerke, ofte bare symbolet eller én bokstav, med tydelige former og få farger. Hvis du ikke har det ennå, lag en forenklet kopi av SVG-en til ikoner.

Sjekk viewBox før du konverterer. En bred viewBox gir et ikon med tomme felt over og under merket, så beskjær det til et kvadrat først. Veiledningen om å beskjære et bilde til et sideforhold dekker kvadratiske utsnitt, og SVG til PNG gir en rask, stor forhåndsvisning for å vurdere designet.

Vanlige spørsmål om SVG til ikon

Hva er forskjellen på denne siden og SVG til ICO?

SVG til ICO handler om den enkelte .ico-filen for favikoner og Windows. Denne siden dekker alle steder et ikon brukes, inkludert macOS ICNS og PNG-ene i faste størrelser som Android, iOS og appbutikker krever.

Hvilket ikonformat bruker hvert operativsystem?

Windows leser ICO, macOS leser ICNS eller ressurskataloger bygget i Xcode, og Android og iOS bruker PNG-bilder levert i faste pikselstørrelser.

Kan jeg få alle PNG-størrelsene til appen min i én konvertering?

Nei. En PNG inneholder én størrelse, så hver konvertering skriver én bredde. Sett Endre størrelse på det ferdige bildet til én størrelse, konverter, endre tallet og konverter på nytt. Hver størrelse tegnes skarpt fra vektoren.

Dekker ICNS-filen fra denne siden Retina-ikoner på Mac?

Den inneholder størrelser fra 16 opp til 256 px. Dagens macOS-appikoner har også oppføringer på 512 px og 1024 px for Retina-skjermer, som Xcode eller Apples iconutil bygger fra PNG-er. Eksporter disse to som PNG her og legg dem til i settet.

Bør ikonet ha gjennomsiktig bakgrunn?

For ICO, ICNS og Android-startlag: ja, gjennomsiktighet lar systemet tegne sin egen bakgrunn. Ikonet for iOS App Store er unntaket. Apple avviser et markedsføringsikon på 1024 px med alfakanal, så gi den PNG-en en ensfarget bakgrunn i SVG-en.

Hvorfor blir den detaljerte logoen min en klatt som lite ikon?

Ved 16 eller 32 px er det ikke plass til tynne linjer eller liten tekst. Gjør streker tykkere slik at de dekker minst én hel piksel i den minste størrelsen, og dropp ordmerket.