Membuat ikon aplikasi Windows Anda

Setelah merancang ikon aplikasi, Anda perlu membuat file ikon itu sendiri. Karena Windows mendukung beberapa tema, resolusi tampilan, dan faktor skala, Anda harus menyediakan beberapa versi ikon Anda untuk memastikannya terlihat hebat di setiap perangkat, dalam ukuran apa pun.

Ukuran ikon (WPF, UWP, WinUI)

Windows akan menampilkan ikon aplikasi Anda pada berbagai ukuran tergantung di mana ikon Anda ditampilkan dan pengaturan skala tampilan pengguna. Tabel berikut mencantumkan semua kemungkinan ukuran yang mungkin digunakan Windows untuk menampilkan ikon Anda.

Ukuran ikon (Win32)

File Windows ICO sudah ada sejak lama. Ada ukuran standar yang digunakan yang merupakan subset dari set lengkap di atas.

Penskalakan ikon

Saat Windows menampilkan ikon aplikasi Anda, ikon tersebut akan mencari kecocokan ukuran yang tepat terlebih dahulu. Jika tidak ada kecocokan yang tepat, itu akan mencari ukuran berikutnya di atas dan menurunkan skala. Menyertakan lebih banyak ukuran ikon dengan aplikasi Anda berarti Windows akan lebih sering memiliki kecocokan sempurna piksel, dan mengurangi jumlah penskalaan yang diterapkan ke ikon berskala.

Faktor skala Windows 11	100%	125%	150%	200%	250%	300%	400%
Menu konteks, bilah judul, baki sistem	16px	20px	24px	32px	40px	48px	64px
Taskbar, hasil pencarian, Daftar mulai semua aplikasi	24px	30px	36px	48px	60px	72px	96px
Mulai pin	32px	40px	48px	64px	80px	96px	256px

Catatan

Aplikasi harus memiliki, minimal: 16x16, 24x24, 32x32, 48x48, dan 256x256. Ini mencakup ukuran ikon yang paling umum, dan dengan menyediakan ikon 256px, memastikan Windows hanya boleh menurunkan skala ikon Anda, tidak pernah naik.

Latar belakang transparan

Ikon terlihat terbaik dengan latar belakang transparan. Jika branding aplikasi Anda mengharuskan ikon Anda dilapisi di latar belakang, tidak apa-apa juga. Namun, Anda harus menerapkan kembali beberapa fungsionalitas tema yang didapatkan ikon transparan secara gratis. Misalnya, Anda mungkin menyediakan versi ikon aplikasi yang dilapisi pada dua latar belakang yang berbeda, yang lebih cocok untuk tema terang dan yang lainnya ke tema gelap.

Daftar lengkap ikon dan variasi

Windows menggunakan aset ikon yang berbeda dalam konteks UI yang berbeda. Penggunaan telah sedikit berubah antara Windows 10 & Windows 11.

Daftar di bawah ini menentukan nama file tertentu yang diharapkan Windows untuk berisi setiap ikon yang sesuai.

Ikon aplikasi

Di Windows 10 dan 11, ikon AppList adalah ikon utama aplikasi Anda. Ini akan digunakan di beberapa tempat, termasuk Taskbar, Mulai pin, semua daftar aplikasi, dan daftar hasil pencarian. Windows 11 memilih ikon yang sesuai untuk semua daftar aplikasi berdasarkan faktor skala saat ini, tetapi Windows 10 menggunakan ikon tertentu yang ditentukan secara eksplisit jika Anda menyediakannya.

File terpisah untuk ketiga variasi tema (default, tema terang, tema gelap) diperlukan, bahkan jika ikonnya sama. Jika Anda tidak menyediakan file-file ini, ikon Anda akan muncul pada pelat ikon sistem untuk memastikan rasio kontras minimum.

Ukuran Target Daftar Aplikasi (Diperlukan)

• 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

Tema gelap (Diperlukan)

• 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

Tema ringan (Diperlukan)

• 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 Daftar Aplikasi (Windows 10) (Opsional)

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

Tema ringan (Windows 10) (Opsional)

• 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

Catatan

Jika Anda tidak menyertakan aset targetsize-*-altform-unplated di atas ikon Anda akan menskalakan ke ukuran yang lebih kecil dan akan mendapatkan backplate yang tidak diinginkan di belakang ikon di Taskbar dan Start.

Petak Peta

Windows 10 mendukung empat ukuran petak: kecil, sedang, lebar, dan besar.

Tema default / gelap (diperlukan sebagian)

• 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

Tema ringan (opsional)

• 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

Catatan

Windows 11 tidak menggunakan aset petak peta, tetapi saat ini minimal aset petak peta Sedang pada 100% diperlukan untuk diterbitkan ke Microsoft Store. Jika aplikasi Anda kompatibel dengan Windows 10 & 11, disarankan agar Anda menyertakan aset petak peta sebanyak mungkin.

Layar percikan

Layar splash juga dapat menjadi tema Terang dan Gelap yang sadar seperti aset ikon Aplikasi.

Default

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

Tema gelap (Opsional)

• 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

Tema ringan (Opsional)

• 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 lencana

Ikon lencana digunakan pada layar kunci Windows 10 dan untuk sebagian besar aplikasi tidak diperlukan.

Windows 10 (opsional)

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

Logo paket (logo Microsoft Store)

Aset ini diperlukan untuk diterbitkan ke Microsoft Store.

Tema Default / Gelap (diperlukan)

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

Tema ringan (opsional)

• 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