Przejdź do treści

Generuj ikony aplikacji na iOS i Android

Zamień jeden obraz na ikony we wszystkich rozmiarach dla iOS, systemu Android, PWA i favicon, z katalogiem zasobów Xcode i warstwami ikony adaptacyjnej. Całość spakujesz do pliku ZIP w przeglądarce.

Upuść grafikę ikonyPNG, JPG, WebP lub SVG · najlepiej od 1024 × 1024 px · do 50 MB
Wybierz plikPrzetwarzane na urządzeniu – pliki nie opuszczają urządzenia

Z jednego obrazu powstanie ikon PNG dla iOS, Androida i internetu: 39. Dostaniesz też Contents.json, XML ikony adaptacyjnej, favicon.ico i manifest webowy – wszystko powstaje w przeglądarce.

Działa w przeglądarce · bez przesyłania na serwerJak to działa

Jak korzystać: Generator ikon aplikacji

  1. 1

    Dodaj grafikę

    Upuść kwadratowy plik PNG, JPG, WebP lub SVG, najlepiej o rozmiarze 1024 × 1024 pikseli lub większy. Logo z przezroczystym tłem też się sprawdzi.

  2. 2

    Wybierz platformy

    Zostaw iOS, Android i Web i PWA albo odznacz te, dla których nie publikujesz aplikacji. Wybierz pełny zestaw rozmiarów dla Xcode albo pojedynczą ikonę 1024 px.

  3. 3

    Dopasuj wygląd

    Ustaw margines, kolor tła i rozmiar grafiki wewnątrz ikon adaptacyjnych i maskable. Sprawdź przy tym linie bezpiecznej strefy i kształty launcherów.

  4. 4

    Pobierz ZIP

    Kliknij Pobierz ZIP i skopiuj każdy folder do swojego projektu. Plik README w środku podpowiada, gdzie trafia każdy plik.

Limity i Pro

Za darmo i bez znaku wodnego: jeden obraz źródłowy do 50 MB naraz, do 44 ikon PNG w jednym ZIP (domyślnie 39, kolejne 5 z warstwą ikony tematycznej), bez limitu pobrań.

O narzędziu: Generator ikon aplikacji

Generator ikon aplikacji zamienia jeden obraz w kompletny zestaw ikon, którego potrzebuje aplikacja mobilna lub progresywna aplikacja webowa. Pliki mają nazwy i foldery takie, jakich oczekują Xcode, Android Studio i przeglądarki. Po wybraniu wszystkich platform archiwum ZIP zawiera 39 plików PNG: 15 do katalogu zasobów iPhone'a i iPada, w tym ikonę App Store 1024 px, 15 obrazów launchera Androida w gęstościach od mdpi do xxxhdpi, ikonę Google Play 512 px oraz 8 ikon webowych. Są wśród nich rozmiary manifestu 192 i 512 px, wersje maskable, apple-touch-icon 180 px oraz favicony 16, 32 i 48 px.

Oprócz obrazów dostajesz plik Contents.json dla AppIcon.appiconset, XML mipmap-anydpi-v26 dla ikon adaptacyjnych Androida 8 z zasobem koloru tła, plik favicon.ico z trzema rozmiarami, blok icons do manifest.webmanifest oraz znaczniki link do HTML. Pliki iOS powstają bez kanału alfa, bo Xcode odrzuca ikony App Store, które go mają. Każdy rozmiar jest zmniejszany z wzorca 1024 px w krokach co połowę, dzięki czemu małe ikony pozostają ostre.

Narzędzie nie projektuje ikony ani nie usuwa tła. Dla warstwy tła ikony adaptacyjnej używa jednolitego koloru, a nie drugiego obrazu. Podglądy Squircle, Kropla i koło naśladują popularne launchery. Każdy producent telefonów rysuje własną maskę, więc sprawdź wynik na prawdziwym urządzeniu.

Prywatność

Twoją grafikę dekoduje, zmienia jej rozmiar i pakuje do archiwum ZIP ta karta przeglądarki, z użyciem canvas i lokalnego Web Workera. Obraz nie opuszcza urządzenia, a nic nie jest przesyłane na serwer ani zapisywane.

Funkcje

Katalog zasobów Xcode

AppIcon.appiconset z plikiem Contents.json, wszystkie rozmiary iPhone'a i iPada, pliki PNG bez kanału alfa.

Adaptacyjne ikony Androida

Warstwy pierwszego planu, zasób koloru tła, ikony okrągłe, warstwa tematyczna i ikona Google Play 512.

PWA i favicony

Ikony manifestu, wersje maskable, apple-touch-icon, favicon.ico i gotowe znaczniki HTML.

Generator ikon aplikacji: najczęstsze pytania

Jakiego rozmiaru powinien być obraz źródłowy?
Użyj kwadratowego obrazu o rozmiarze co najmniej 1024 × 1024 pikseli, czyli tyle, ile ma ikona App Store, największy plik w zestawie. Mniejsze obrazy też zadziałają, ale duże ikony będą powiększone i miękkie, a narzędzie ostrzeże Cię o tym. Pliki SVG są rysowane w pełnej rozdzielczości, więc logo wektorowe daje ostry wynik w każdym rozmiarze.
Gdzie w projekcie Xcode umieścić pliki?
Otwórz Assets.xcassets w Xcode, usuń istniejący zestaw AppIcon i przeciągnij folder ios/AppIcon.appiconset z archiwum ZIP. Możesz też podmienić ten folder w Finderze. Plik Contents.json przypisuje każdy PNG do miejsca dla iPhone'a, iPada lub App Store. Jeśli projekt używa Xcode 14 lub nowszego, możesz wybrać opcję Single 1024, a Xcode utworzy mniejsze rozmiary.
Jak działają ikony adaptacyjne Androida?
Od Androida 8 ikona launchera składa się z dwóch warstw 108 dp: tła, tutaj w wybranym przez Ciebie kolorze, oraz pierwszego planu z Twoją grafiką. Launcher przycina środkowe 72 dp i nakłada własny kształt, na przykład koło lub squircle, więc wszystko poza środkowym kołem 66 dp może zniknąć. Linie bezpiecznej strefy pokazują te dwie granice na podglądzie.
Czym jest ikona maskable w PWA?
Ikona maskable wypełnia tłem cały kwadrat, dzięki czemu Android może wyciąć z niej dowolny kształt bez białych krawędzi. Przeglądarki gwarantują tylko koło obejmujące środkowe 80% obrazu, więc logo trzymaj w jego wnętrzu. Archiwum ZIP zawiera pliki PNG maskable 192 i 512 px, a fragment manifestu oznacza je jako purpose maskable obok zwykłych ikon.
Dlaczego ikony iOS mają kolor tła?
Apple wymaga, by ikony aplikacji były w pełni nieprzezroczyste: ikona App Store z kanałem alfa nie przechodzi walidacji, a przezroczyste obszary wyglądałyby na ekranie głównym jak czerń. Dlatego narzędzie wypełnia kolorem tła ikony iOS, apple-touch-icon, ikonę Google Play oraz ikony adaptacyjne i maskable, nawet gdy włączysz przezroczyste ikony webowe.

Podobne narzędzia

Wszystko z kategorii: narzędzia dla programistów

Generator favicon

Ikony ICO, PNG i manifest z obrazu, tekstu lub emoji

Konwerter SVG ↔ PNG

Zamień SVG na ostry obraz PNG albo PNG na SVG

Zmiana rozmiaru obrazów

Piksele, procenty lub gotowe rozmiary – hurtowo

Generator palet kolorów i kontrast WCAG

Palety, odcienie, kontrast WCAG i symulacja daltonizmu