Konstruuj ikonę aplikacji systemu Windows

Po zaprojektowaniu ikony aplikacji musisz utworzyć same pliki ikon. Ponieważ system Windows obsługuje wiele motywów, rozdzielczości wyświetlania i czynników skalowania, należy podać wiele wersji ikony, aby upewnić się, że wygląda świetnie na każdym urządzeniu, w dowolnym rozmiarze.

Rozmiary ikon (WPF, UWP, WinUI)

Windows wyświetli ikonę Twojej aplikacji w różnych rozmiarach, w zależności od miejsca jej wyświetlania oraz od ustawień skalowania wyświetlania użytkownika. W poniższej tabeli wymieniono wszystkie możliwe rozmiary, których system Windows może użyć do wyświetlenia ikony.

Rozmiary ikon (Win32)

Pliki ICO systemu Windows istnieją od dłuższego czasu. Istnieją standardowe rozmiary, które są używane, które są podzbiorem pełnego zestawu powyżej.

Skalowanie ikon

Gdy system Windows wyświetli ikonę aplikacji, będzie ona najpierw szukać dokładnego dopasowania rozmiaru. Jeśli nie ma dokładnego dopasowania, będzie szukać następnego rozmiaru powyżej i skalowania w dół. Uwzględnienie większej liczby rozmiarów ikon w aplikacji oznacza, że system Windows częściej będzie miał idealne dopasowanie pikseli i zmniejsza ilość skalowania zastosowanego do skalowanych ikon.

Współczynnik skalowania systemu Windows 11	100%	125%	150%	200%	250%	300%	400%
Menu kontekstowe, pasek tytułu, pasek systemu	16 pikseli	20 pikseli	24 piksele	32 piksele	40 pikseli	48 pikseli	64 piksele
Pasek zadań, wyniki wyszukiwania, Uruchamianie listy wszystkich aplikacji	24 piksele	30 pikseli	36 pikseli	48 pikseli	60 pikseli	72 piksele	96 pikseli
Piny początkowe	32 piksele	40 pikseli	48 pikseli	64 piksele	80 pikseli	96 pikseli	256 pikseli

Uwaga / Notatka

Aplikacje powinny mieć co najmniej: 16x16, 24x24, 32x32, 48x48 i 256x256. Obejmuje to najbardziej typowe rozmiary ikon i udostępniając ikonę 256 pikseli, zapewnia, że system Windows powinien zawsze skalować ikonę w dół, nigdy nie w górę.

Przezroczyste tła

Ikony wyglądają najlepiej z przezroczystym tłem. Jeśli branding Twojej aplikacji wymaga, aby ikona była umieszczona na tle, to w porządku. Należy jednak ponownie zaimplementować niektóre funkcje motywowe, które można bezpłatnie uzyskać za pomocą przezroczystych ikon. Na przykład możesz podać wersję ikony aplikacji na dwóch różnych tłach, która lepiej nadaje się do motywu jasnego i drugiego do motywu ciemnego.

Pełna lista ikon i odmian

System Windows korzysta z różnych zasobów ikon w różnych kontekstach interfejsu użytkownika. Użycie zmieniło się nieco między systemami Windows 10 i Windows 11.

Poniższe listy definiują określone nazwy plików, których system Windows oczekuje, że będzie zawierać każdą odpowiednią ikonę.

Ikona aplikacji

W systemach Windows 10 i 11 ikona AppList jest ikoną podstawową aplikacji. Będzie on używany w kilku miejscach, takich jak pasek zadań, układ Start, lista wszystkich aplikacji oraz lista wyników wyszukiwania. System Windows 11 wybiera odpowiednią ikonę dla listy wszystkich aplikacji na podstawie bieżącego współczynnika skalowania, ale system Windows 10 używa określonych, jawnie zdefiniowanych ikon, jeśli je podasz.

Wymagane są oddzielne pliki dla wszystkich trzech odmian motywu (domyślny, motyw jasny, motyw ciemny), nawet jeśli ikona jest taka sama. Jeśli te pliki nie zostaną podane, ikona pojawi się na tablicy ikony systemu, aby zapewnić minimalny współczynnik kontrastu.

Rozmiar docelowy listy aplikacji (wymagany)

• AppList.targetsize-16.png
• AppList.targetsize-20.png
• AppList.targetsize-24.png
• AppList.targetsize-30.png
• AppList.targetsize-32.png
• AppList.targetsize-36.png
• AppList.targetsize-40.png
• AppList.targetsize-48.png
• AppList.targetsize-60.png
• AppList.targetsize-64.png
• AppList.targetsize-72.png
• AppList.targetsize-80.png
• AppList.targetsize-96.png
• AppList.targetsize-256.png

Motyw ciemny (wymagany)

• AppList.targetsize-16_altform-unplated.png
• AppList.targetsize-20_altform-unplated.png
• AppList.targetsize-24_altform-unplated.png
• AppList.targetsize-30_altform-unplated.png
• AppList.targetsize-32_altform-unplated.png
• AppList.targetsize-36_altform-unplated.png
• AppList.targetsize-40_altform-unplated.png
• AppList.targetsize-48_altform-unplated.png
• AppList.targetsize-60_altform-unplated.png
• AppList.targetsize-64_altform-unplated.png
• AppList.targetsize-72_altform-unplated.png
• AppList.targetsize-80_altform-unplated.png
• AppList.targetsize-96_altform-unplated.png
• AppList.targetsize-256_altform-unplated.png

Motyw jasny (wymagany)

• AppList.targetsize-16_altform-lightunplated.png
• AppList.targetsize-20_altform-lightunplated.png
• AppList.targetsize-24_altform-lightunplated.png
• AppList.targetsize-30_altform-lightunplated.png
• AppList.targetsize-32_altform-lightunplated.png
• AppList.targetsize-36_altform-lightunplated.png
• AppList.targetsize-40_altform-lightunplated.png
• AppList.targetsize-48_altform-lightunplated.png
• AppList.targetsize-60_altform-lightunplated.png
• AppList.targetsize-64_altform-lightunplated.png
• AppList.targetsize-72_altform-lightunplated.png
• AppList.targetsize-80_altform-lightunplated.png
• AppList.targetsize-96_altform-lightunplated.png
• AppList.targetsize-256_altform-lightunplated.png

Skala listy aplikacji (Windows 10) (opcjonalnie)

• AppList.scale-100.png
• AppList.scale-125.png
• AppList.scale-150.png
• AppList.scale-200.png
• AppList.scale-400.png

Motyw jasny (Windows 10) (opcjonalnie)

• AppList.scale-100_altform-colorful_theme-light.png
• AppList.scale-125_altform-colorful_theme-light.png
• AppList.scale-150_altform-colorful_theme-light.png
• AppList.scale-200_altform-colorful_theme-light.png
• AppList.scale-400_altform-colorful_theme-light.png

Uwaga / Notatka

Jeśli nie dołączysz zasobów targetsize-*-altform-unplated związanych z ikoną, zostanie ona przeskalowana do mniejszego rozmiaru i pojawi się niepożądane tło za ikoną na pasku zadań i w menu Start.

Płytki

System Windows 10 obsługuje cztery rozmiary kafelków: mały, średni, szeroki i duży.

Motyw domyślny/ciemny (częściowo wymagany)

• SmallTile.scale-100.png
• SmallTile.scale-125.png
• SmallTile.scale-150.png
• SmallTile.scale-200.png
• SmallTile.scale-400.png

• MedTile.scale-100.png
• MedTile.scale-125.png
• MedTile.scale-150.png
• MedTile.scale-200.png
• MedTile.scale-400.png

• WideTile.scale-100.png
• WideTile.scale-125.png
• WideTile.scale-150.png
• WideTile.scale-200.png
• WideTile.scale-400.png

• LargeTile.scale-100.png
• LargeTile.scale-125.png
• LargeTile.scale-150.png
• LargeTile.scale-200.png
• LargeTile.scale-400.png

Motyw jasny (opcjonalnie)

• SmallTile.scale-100_altform-colorful_theme-light.png
• SmallTile.scale-125_altform-colorful_theme-light.png
• SmallTile.scale-150_altform-colorful_theme-light.png
• SmallTile.scale-200_altform-colorful_theme-light.png
• SmallTile.scale-400_altform-colorful_theme-light.png

• MedTile.scale-100_altform-colorful_theme-light.png
• MedTile.scale-125_altform-colorful_theme-light.png
• MedTile.scale-150_altform-colorful_theme-light.png
• MedTile.scale-200_altform-colorful_theme-light.png
• MedTile.scale-400_altform-colorful_theme-light.png

• WideTile.scale-100_altform-colorful_theme-light.png
• WideTile.scale-125_altform-colorful_theme-light.png
• WideTile.scale-150_altform-colorful_theme-light.png
• WideTile.scale-200_altform-colorful_theme-light.png
• WideTile.scale-400_altform-colorful_theme-light.png

• LargeTile.scale-100_altform-colorful_theme-light.png
• LargeTile.scale-125_altform-colorful_theme-light.png
• LargeTile.scale-150_altform-colorful_theme-light.png
• LargeTile.scale-200_altform-colorful_theme-light.png
• LargeTile.scale-400_altform-colorful_theme-light.png

Uwaga / Notatka

System Windows 11 nie korzysta z zasobów kafelków, ale obecnie zasoby średnich kafelków na poziomie 100% są wymagane do opublikowania w Sklepie Microsoft. Jeśli aplikacja jest zgodna z systemami Windows 10 i 11, zaleca się dołączenie jak największej liczby zasobów kafelków.

Ekran startowy

Ekrany powitalne mogą również rozpoznawać jasne i ciemne motywy, tak jak zasoby ikon aplikacji.

Domyślny

• SplashScreen.scale-100.png
• SplashScreen.scale-125.png
• SplashScreen.scale-150.png
• SplashScreen.scale-200.png
• SplashScreen.scale-400.png

Motyw ciemny (opcjonalnie)

• SplashScreen.scale-100_altform-colorful_theme-dark.png
• SplashScreen.scale-125_altform-colorful_theme-dark.png
• SplashScreen.scale-150_altform-colorful_theme-dark.png
• SplashScreen.scale-200_altform-colorful_theme-dark.png
• SplashScreen.scale-400_altform-colorful_theme-dark.png

Motyw jasny (opcjonalnie)

• SplashScreen.scale-100_altform-colorful_theme-light.png
• SplashScreen.scale-125_altform-colorful_theme-light.png
• SplashScreen.scale-150_altform-colorful_theme-light.png
• SplashScreen.scale-200_altform-colorful_theme-light.png
• SplashScreen.scale-400_altform-colorful_theme-light.png

Logo znaczka

Ikony znaczka są używane na ekranie blokady systemu Windows 10 i dla większości aplikacji nie są wymagane.

Windows 10 (opcjonalnie)

• BadgeLogo.scale-100.png
• BadgeLogo.scale-125.png
• BadgeLogo.scale-150.png
• BadgeLogo.scale-200.png
• BadgeLogo.scale-400.png

Logo pakietu (logo sklepu Microsoft Store)

Te zasoby są wymagane do opublikowania w sklepie Microsoft Store.

Motyw domyślny/ciemny (wymagany)

• StoreLogo.scale-100.png
• StoreLogo.scale-125.png
• StoreLogo.scale-150.png
• StoreLogo.scale-200.png
• StoreLogo.scale-400.png

Motyw jasny (opcjonalnie)

• StoreLogo.scale-100_altform-colorful_theme-light.png
• StoreLogo.scale-125_altform-colorful_theme-light.png
• StoreLogo.scale-150_altform-colorful_theme-light.png
• StoreLogo.scale-200_altform-colorful_theme-light.png
• StoreLogo.scale-400_altform-colorful_theme-light.png