Partilhar via

Construa o ícone do seu aplicativo do Windows

  • Artigo

Um diagrama que mostra vários locais de ícones no Windows 11.

Depois de criar o ícone do aplicativo, é necessário criar os próprios arquivos de ícone. Como o Windows oferece suporte a vários temas, resoluções de vídeo e fatores de escala, você deve fornecer várias versões do ícone para garantir que ele fique ótimo em todos os dispositivos, em qualquer tamanho.

Tamanhos de ícones (WPF, UWP, WinUI)

O Windows exibirá o ícone do aplicativo em vários tamanhos, dependendo de onde o ícone está sendo exibido e das configurações de escala de exibição do usuário. A tabela a seguir lista todos os tamanhos possíveis que o Windows pode usar para exibir seu ícone.

Tamanhos de ícones (Win32)

Os arquivos ICO do Windows existem há muito tempo. Existem tamanhos padrão que são usados, que é um subconjunto do conjunto completo acima.

Dimensionamento de ícones

Quando o Windows exibir o ícone do aplicativo, ele procurará uma correspondência de tamanho exata primeiro. Se não houver correspondência exata, ele procurará o próximo tamanho acima e reduzirá verticalmente. Incluir mais tamanhos de ícones com seu aplicativo significa que o Windows terá mais frequentemente uma correspondência perfeita de pixels e reduzirá a quantidade de dimensionamento aplicada a ícones dimensionados.

Fator de escala do Windows 11 100% 125% 150% 200% 250% 300% 400%
Menu de contexto, barra de título, bandeja do sistema 16px 20px 24px 32px 40px 48px 64px
Barra de tarefas, resultados da busca, Iniciar todos os detalhes do aplicativo 24px 30px 36px 48px 60px 72px 96px
Marcadores iniciais 32px 40px 48px 64px 80px 96px 256px

Observação

Os aplicativos devem ter, no mínimo: 16x16, 24x24, 32x32, 48x48 e 256x256. Isso abrange os tamanhos de ícone mais comuns e, ao fornecer um ícone de 256px, garante que o Windows só reduza a escala do ícone, nunca para cima.

Transparência da tela de fundo

Os ícones ficam melhores com uma tela de fundo transparente. Se a identidade visual do aplicativo exigir que o ícone seja colocado em uma tela de fundo, tudo bem também. No entanto, você terá que reimplementar algumas funcionalidades de temas que ícones transparentes obtêm gratuitamente. Por exemplo, é possível fornecer uma versão do ícone do aplicativo chapeada em duas telas de fundo diferentes, uma mais adequada a um tema claro e a outra a um tema escuro.

Lista completa de ícones e variações

O Windows utiliza diferentes ativos de ícone em diferentes contextos de interface do usuário. O uso mudou um pouco entre o Windows 10 e o Windows 11.

As listas abaixo definem os nomes de arquivos específicos que o Windows espera que contenham cada ícone correspondente.

Ícone do aplicativo

No Windows 10 e 11, o ícone AppList é o ícone principal do aplicativo. Ele será usado em vários lugares, incluindo a Barra de Tarefas, os marcadores Iniciar, todos os detalhes do aplicativo e a lista de resultados da busca. O Windows 11 seleciona um ícone apropriado para a lista de todos os aplicativos com base no fator de escala atual, mas o Windows 10 usa ícones específicos e explicitamente definidos se você fornecê-los.

Arquivos separados para todas as três variações de tema (padrão, tema claro, tema escuro) são necessários, mesmo que o ícone seja o mesmo. Se você não fornecer esses arquivos, seu ícone aparecerá em uma placa de ícone do sistema para garantir uma taxa de contraste mínima.

Tamanho de destino da lista de aplicativos (obrigatório)

  • 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 escuro (obrigatório)

  • 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 claro (obrigatório)

  • 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

Escala da Lista de Aplicativos (Windows 10) (Opcional)

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

Tema claro (Windows 10) (Opcional)

  • 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

Observação

Se você não incluir os ativos targetsize-*-altform-unplated acima, seu ícone será dimensionado para um tamanho menor e receberá uma placa traseira indesejável atrás do ícone na Barra de Tarefas e na Tela Inicial.

Blocos

O Windows 10 oferece suporte a quatro tamanhos de bloco: pequeno, médio, largo e grande.

Tema padrão/escuro (parcialmente necessário)

  • 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 claro (opcional)

  • 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

Observação

O Windows 11 não usa os ativos de bloco, mas atualmente no mínimo os ativos de bloco Médio em 100% são necessários para publicar na Microsoft Store. Se o aplicativo for compatível com o Windows 10 e 11, é recomendável que você inclua o maior número possível de ativos de bloco.

Tela inicial

As telas iniciais também podem ter reconhecimento de temas Claro e Escuro, como os ativos de ícone do aplicativo.

Default

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

Tema escuro (opcional)

  • 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 claro (opcional)

  • 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

Os ícones de selo são usados na tela de bloqueio do Windows 10 e, para a maioria dos aplicativos, não são necessários.

Windows 10 (opcional)

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

Esses ativos são necessários para publicar na Microsoft Store.

Tema Padrão/Escuro (obrigatório)

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

Tema claro (opcional)

  • 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