Observação
O acesso a essa página exige autorização. Você pode tentar entrar ou alterar diretórios.
O acesso a essa página exige autorização. Você pode tentar alterar os diretórios.
Um diagrama que mostra vários locais de ícones no Windows 11.
Depois de projetar o ícone do aplicativo, você precisará criar os próprios arquivos de ícone. Como Windows dá suporte a vários temas, resoluções de exibição 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 ícone (WPF, UWP, WinUI)
Windows exibirá o ícone do aplicativo em uma variedade de 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 Windows podem usar para exibir seu ícone.
Tamanhos de ícone (Win32)
Arquivos ICO do Windows existem há muito tempo. Há tamanhos padrão que são usados, que é um subconjunto do conjunto completo acima.
Dimensionamento de ícones
Quando Windows exibir o ícone do aplicativo, ele primeiro procurará uma correspondência exata de tamanho. Se não houver correspondência exata, ele procurará o próximo tamanho acima e reduzirá verticalmente. Incluir mais tamanhos de ícones no seu aplicativo significa que o Windows terá uma correspondência de pixels perfeita com mais frequência e reduzirá a quantidade de redimensionamento aplicada a ícones escalonados.
| 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 | 96 px |
| Pinos de Inicialização | 32px | 40px | 48px | 64px | 80px | 96 px | 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 Windows só deve reduzir o ícone, nunca para cima.
Como os tamanhos de ícone se relacionam com o manifesto MSIX
Se você examinou o manifesto MSIX (ou AppX) do seu aplicativo, talvez tenha notado entradas como Square44x44Logo e Square150x150Logo. Esses são tamanhos base, não os únicos tamanhos de que seu aplicativo precisa. Windows usa fatores de escala de exibição para determinar as dimensões reais de pixel que ele solicita em runtime. O manifesto aponta para um nome de arquivo de imagem base (por exemplo), Square44x44Logo.pnge você fornece variantes pré-dimensionadas usando qualificadores (por exemplo, Square44x44Logo.scale-200.png). O Windows escolhe a opção mais adequada para as configurações de exibição do usuário.
A tabela a seguir mostra como cada entrada do manifesto corresponde a tamanhos reais em pixels em cada fator de escala:
| Entrada de manifesto | Tamanho base | 100% | 125% | 150% | 200% | 250% | 300% | 400% |
|---|---|---|---|---|---|---|---|---|
| Square44x44Logo | 44 px | 44 px | 55 px | 66 px | 88 px | 110 px | 132 px | 176 px |
| Square150x150Logo | 150 px | 150 px | 188 px | 225 px | 300 px | 375 px | 450 px | 600 px |
| Wide310x150Logo | 310×150 px | 310×150 px | 388×188 px | 465×225 px | 620×300 px | 775×375 px | 930×450 px | 1240×600 px |
| Square310x310Logo | 310 px | 310 px | 388 px | 465 px | 620 px | 775 px | 930 px | 1240 px |
| Square71x71Logo | 71 px | 71 px | 89 px | 107 px | 142 px | 178 px | 213 px | 284 px |
| Logotipo da Loja | 50 px | 50 px | 63 px | 75 px | 100 px | 125 px | 150 px | 200 px |
O ícone da lista de aplicativos também oferece suporte a variantes target-size (listadas na seção Ícone do aplicativo abaixo), que o Windows usa para ícones da barra de tarefas, menus de contexto e outros elementos da interface do usuário em que o ícone é exibido sem preenchimento do bloco. Os recursos em tamanho de destino são especificados em dimensões exatas em pixels (16, 24, 32, 48, 256, entre outros), em vez de fatores de escala.
Tip
Você não precisa criar todos os tamanhos possíveis. No mínimo, forneça recursos nas escalas de 100%, 200% e 400% para as entradas Square44x44Logo e Square150x150Logo, além das variantes do tamanho de destino listadas na seção Ícone do aplicativo. Windows escolhe o ativo mais próximo disponível para fatores de escala intermediários (125%, 150%, 250%e 300%).
Para obter o esquema de manifesto completo, consulte VisualElements.
Planos de fundo transparentes
Os ícones têm a melhor aparência com um plano de fundo transparente. Se a identidade visual do aplicativo exigir que o ícone esteja sobre um fundo, tudo bem também. No entanto, você precisará implementar novamente algumas funcionalidades de temas que os ícones transparentes obtêm gratuitamente. Por exemplo, você pode fornecer uma versão do ícone do aplicativo disposta em dois fundos diferentes, um mais apropriado para um tema claro e o outro para um tema escuro.
Lista completa de ícones e variações
Windows utiliza diferentes ícones em diferentes contextos de UI. O uso mudou um pouco entre Windows 10 e Windows 11.
As listas abaixo definem os nomes de arquivo específicos Windows espera conter cada ícone correspondente.
Ícone do aplicativo
Em Windows 10 e 11, o ícone AppList é o ícone principal do aplicativo. Ele será usado em vários locais, incluindo a barra de tarefas, os pinos iniciar, a lista de todos os aplicativos e a lista de resultados da pesquisa. Windows 11 seleciona um ícone apropriado para a lista de todos os aplicativos com base no fator de escala atual, mas Windows 10 usa ícones específicos definidos explicitamente 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
App List Scale (Windows 10) (Opcional)
- AppList.scale-100.png
- AppList.scale-125.png
- AppList.scale-150.png
- AppList.scale-200.png
- AppList.scale-400.png
tema Light (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.
Azulejos
Windows 10 dá 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
Logotipo do selo
Ícones de selo são usados na tela de bloqueio 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
Logotipo do pacote (logotipo da Microsoft Store)
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
Colaborar conosco no GitHub
A fonte deste conteúdo pode ser encontrada no GitHub, onde você também pode criar e revisar problemas e solicitações de pull. Para obter mais informações, confira o nosso guia para colaboradores.
Windows developer