UltKit

Převod SVG na ikonu

Jedno vektorové logo pokryje všechna místa, kde potřebujete ikonu: favicon, zástupce ve Windows, aplikaci pro Mac i ikony na ploše telefonu. Stránka začíná na ICO s více velikostmi a pro ostatní platformy můžete přepnout na ICNS nebo PNG.

Převodník obrázků

nebo sem přetáhněte soubory JPG, JPEG, JPE … ·

Max. 95 MB na soubor· Až 20 souborů· Smazáno po 30 minutách

Výstup

Soubory se zpracovávají na našich serverech a po 30 minutách se smažou.

Jak nástroj používat

  1. 1

    Nahrajte čtvercové SVG

    Přidejte SVG svého loga, nejlépe se čtvercovým viewBox. Najednou můžete přidat až 20 souborů, například světlou a tmavou variantu.

  2. 2

    Vyberte formát ikony

    Předvolen je ICO s nastavením Velikosti ikon na Všechny velikosti (16–256). Pro macOS vyberte u Převést na ICNS, pro ikonu telefonu nebo obchodu PNG se šířkou v Změnit velikost výstupního obrázku.

  3. 3

    Převeďte a umístěte soubory

    Stiskněte Převést na ICO (popisek se řídí zvoleným formátem), soubory stáhněte a každý uložte tam, kde ho příslušná platforma očekává.

Jediný formát ikon neexistuje. Windows a prohlížeče používají ICO, macOS ICNS a telefony sady PNG. Když vyjdete ze SVG, každá z nich se vykreslí znovu z vektoru, ostře v každé velikosti.

SVG na ikonu: jeden vektor, tři druhy souborů ikon

Soubor ikony je kontejner malých bitmap, ne vektor. Operační systém vybere bitmapu nejbližší potřebné velikosti, takže dobrá ikona jich obsahuje několik, každou vykreslenou pro její vlastní mřížku.

Předvolba ICO na této stránce zapíše jeden soubor se všemi velikostmi od 16 do 256 px, což pokrývá favicon.ico a zástupce ve Windows. Přepnutím Převést na na ICNS získáte kontejner ikon Applu, na PNG jednotlivé velikosti, které chtějí Android, iOS a obchody s aplikacemi.

Tabulka uvádí, co hlavní platformy zveřejňují pro své sloty ikon.

Soubory ikon, které jednotlivé platformy vyžadují
OrganizacePožadavekZdroj
Plocha a hlavní panel WindowsICO s několika velikostmi, včetně 16, 32, 48 a 256 px—
Favicon webufavicon.ico v kořeni webu s velikostmi 16, 32 a 48 px; PNG 180 × 180 px pro apple-touch-icon—
Ikona aplikace pro macOSICNS nebo katalog zdrojů Xcode, velikosti až 1024 × 1024 px—
Karta aplikace v Google Play32bitové PNG 512 × 512 px, až 1 024 KB—
Apple App StorePNG 1024 × 1024 px bez průhlednosti—

SVG

Scalable Vector Graphics

SVG je vektorový formát založený na XML, který W3C standardizovalo v roce 2001. Místo pixelů popisuje tvary, křivky a text, takže zůstává ostrý v libovolné velikosti a u log a ikon bývá drobný. Podporuje průhlednost, stylování pomocí CSS, skriptování a animace a každý prohlížeč ho zobrazí nativně. Pro fotografie SVG nevyhovuje a složité ilustrace se mohou vykreslovat pomalu. Otevřou a upraví ho Illustrator, Inkscape, Figma i prohlížeče.

Komprese
–
Průhlednost
Ano
Animace
Ano
Představeno
2001 · W3C
Převodník SVG

ICO

Ikona Windows

ICO je formát ikon od Microsoftu, používaný pro ikony programů ve Windows a favicony webů. Jeden soubor .ico může obsahovat několik obrázků v různých velikostech, například 16×16, 32×32, 48×48 a 256×256 pixelů, takže systém může vybrat nejvhodnější. Každý obrázek může být uložen jako bitmapa nebo jako data PNG a podporuje plnou alfa průhlednost. ICO není určeno pro fotografie ani velkou grafiku. Čtou ho prohlížeče, Windows i většina editorů ikon.

Komprese
Bezztrátová
Průhlednost
Ano
Animace
Ne
Představeno
Microsoft
Převodník ICO

Lidé hledají převod SVG na ikonu, když mají jedno vektorové logo a několik platforem, každou s vlastním kontejnerem ikon, od favicon.ico na webu přes ICNS na Macu po PNG pevných velikostí v obchodech s aplikacemi.

Převeďte SVG na ikony pro Windows, Mac, Android a iOS

Ponechte ICO a Velikosti ikon na Všechny velikosti. Výsledek přejmenujte na favicon.ico pro kořen webu, nebo na něj nasměrujte dialog Změnit ikonu u zástupce ve Windows.

  • Jeden soubor .ico poslouží pro karty, záložky i hlavní panel
  • Přidejte PNG 180 px pro záložky na domovské obrazovce iPhonu

Jak navrhnout SVG, které obstojí i v 16 px

Ikona 16 × 16 px má celkem 256 pixelů. Většina značek má samostatnou značku pro ikony, často jen symbol nebo jedno písmeno, s výraznými tvary a málem barev; pokud ta vaše zatím neexistuje, vytvořte zjednodušenou kopii SVG pro ikony.

Před převodem zkontrolujte viewBox. Široký viewBox vytvoří ikonu s prázdnými pruhy nad značkou a pod ní, proto ho nejprve oříznete na čtverec; návod na oříznutí obrázku na poměr stran čtvercový ořez popisuje a SVG do PNG poskytne rychlý velký náhled k posouzení návrhu.

Časté dotazy k převodu SVG na ikonu

Jaký je rozdíl mezi touto stránkou a převodem SVG do ICO?

SVG do ICO se zaměřuje na jediný soubor .ico pro favicony a Windows. Tato stránka pokrývá všechna místa, kam ikona patří, včetně macOS ICNS a PNG pevných velikostí, které chtějí Android, iOS a obchody s aplikacemi.

Jaký formát ikon používá který operační systém?

Windows čte ICO, macOS čte ICNS nebo katalogy zdrojů vytvořené v Xcode a Android a iOS přebírají obrázky PNG dodané v pevných velikostech v pixelech.

Získám všechny velikosti PNG pro aplikaci jedním převodem?

Ne. PNG obsahuje jednu velikost, takže každý převod vytvoří jednu šířku. Nastavte Změnit velikost výstupního obrázku na jednu velikost, převeďte, pak číslo změňte a převeďte znovu; každá velikost se z vektoru vykreslí ostře.

Pokrývá ICNS z této stránky i ikony pro Retina Mac?

Obsahuje velikosti od 16 do 256 px. Současné ikony aplikací pro macOS zahrnují i položky 512 px a 1024 px pro displeje Retina, které z PNG sestavuje Xcode nebo nástroj iconutil od Applu; tyto dvě velikosti zde exportujte jako PNG a přidejte je do sady.

Má mít ikona průhledné pozadí?

U ICO, ICNS a vrstev spouštěče Androidu ano: průhlednost umožní systému vykreslit vlastní pozadí. Výjimkou je ikona iOS pro App Store; Apple odmítne marketingovou ikonu 1024 px s alfa kanálem, proto tomuto PNG dejte v SVG plné pozadí.

Proč se z mého detailního loga v malé ikoně stane skvrna?

Při 16 nebo 32 px není místo na tenké čáry ani malý text. Zesilte tahy tak, aby i při nejmenší velikosti pokryly alespoň jeden celý pixel, a vynechejte logotyp s názvem.