다음을 통해 공유

Windows 앱의 아이콘 생성

  • 아티클

Windows 11의 여러 아이콘 위치를 보여 주는 다이어그램

앱의 아이콘을 디자인했다면, 이후 아이콘 파일을 직접 생성해야 합니다. Windows는 여러 테마, 표시 해상도 및 배율 인수를 지원합니다. 모든 장치에서 원하는 크기로 표시되도록 여러 버전의 아이콘을 제공해야 합니다.

아이콘 크기(WPF, UWP, WinUI)

아이콘이 표시되는 위치와 사용자의 표시 크기 조정 설정에 따라 Windows는 다양한 크기로 앱 아이콘을 표시합니다. 다음 테이블에서는 Windows에서 아이콘을 표시하는 데 사용할 수 있는 모든 크기를 나열합니다.

아이콘 크기(Win32)

Windows ICO 파일은 오랫동안 사용되어 왔습니다. 위의 전체 집합의 하위 집합인 표준 크기가 사용됩니다.

아이콘 크기 조정

Windows에서 앱 아이콘을 표시하면 먼저 정확한 크기 일치 항목을 찾게 됩니다. 정확히 일치하는 항목이 없으면 위의 다음 크기를 찾고 축소합니다. 앱에 더 많은 아이콘 크기를 포함하면 Windows는 픽셀과 완벽하게 일치하는 경우가 많으며 크기 조정된 아이콘에 적용되는 크기 조정의 양을 줄일 수 있습니다.

Windows 11 배율 인수 100% 125% 150% 200% 250% 300% 400%
컨텍스트 메뉴, 제목 표시줄, 시스템 트레이 16px 20px 24px 32px 40px 48px 64px
작업 표시줄, 검색 결과, 모든 앱 목록 시작 24px 30px 36px 48px 60px 72px 96px
핀 시작 32px 40px 48px 64px 80px 96px 256px

참고

앱에는 최소한 16x16, 24x24, 32x32, 48x48 및 256x256이 있어야 합니다. 이는 가장 일반적인 아이콘 크기를 다루며, 256px 아이콘을 제공함으로써 Windows에서 아이콘 크기를 줄이면 안 됩니다.

투명 백그라운드

아이콘은 투명한 백그라운드에서 가장 잘 보입니다. 앱의 브랜딩에서 아이콘을 백그라운드에 표시해야 하는 경우에도 괜찮습니다. 그러나 투명 아이콘이 무료로 제공되는 일부 테마 기능을 다시 구현해야 합니다. 예를 들어 밝은 테마에 더 적합하고 다른 하나는 어두운 테마에 더 적합한 두 가지 백그라운드에 표시된 앱 아이콘 버전을 제공할 수 있습니다.

아이콘 및 변형 전체 목록

Windows는 다양한 UI 컨텍스트에서 다양한 아이콘 자산을 활용합니다. Windows 10 & Windows 11 사이에서 사용량이 약간 변경되었습니다.

아래 목록은 Windows에서 각 해당 아이콘을 포함해야 하는 특정 파일 이름을 정의합니다.

앱 아이콘

Windows 10 및 11에서 AppList 아이콘은 앱의 기본 아이콘입니다. 작업 표시줄, 시작 핀, 모든 앱 목록 및 검색 결과 목록을 비롯한 여러 위치에서 사용됩니다. Windows 11은 현재 배율 인수에 따라 모든 앱 목록에 적합한 아이콘을 선택하지만 Windows 10에서는 명시적으로 정의된 특정 아이콘을 제공합니다.

아이콘이 같더라도 세 가지 테마 변형(기본값, 밝은 테마, 어두운 테마)에 대한 별도의 파일이 필요합니다. 이러한 파일을 제공하지 않는 경우, 최소 대비 비율을 보장하기 위해 아이콘이 시스템 아이콘 판에 표시됩니다.

앱 목록 대상 크기(필수)

  • 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

어두운 테마(필수)

  • 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

밝은 테마(필수)

  • 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

앱 목록 크기 조정(Windows 10)(선택 사항)

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

밝은 테마(Windows 10)(선택 사항)

  • 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

참고

아이콘 위에 targetsize-*-altform-unplated 자산을 포함하지 않을 경우 크기가 더 작은 크기로 조정되고 작업 표시줄 및 시작의 아이콘 뒤에 바람직하지 않은 백플레이트를 가져옵니다.

타일

Windows 10은 4가지 타일 크기(소형, 중간, 와이드 및 대형)를 지원합니다.

기본/어두운 테마(부분적으로 필요)

  • 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

밝은 테마(선택 사항)

  • 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

참고 항목

Windows 11에서는 타일 자산을 사용하지 않지만 현재 Microsoft Store에 게시하려면 최소 100%의 중간 타일 자산이 필요합니다. 앱이 Windows 10 & 11과 호환되는 경우 가능한 한 많은 타일 자산을 포함하는 것이 좋습니다.

스플래시 스크린

스플래시 스크린은 앱 아이콘 자산처럼 밝고 어두운 테마를 인식할 수도 있습니다.

기본값

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

어두운 테마(선택 사항)

  • 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

밝은 테마(선택 사항)

  • 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

배지 아이콘은 Windows 10 잠금 화면에서 사용됩니다. 대부분의 앱에는 필요하지 않습니다.

Windows 10(선택 사항)

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

이러한 자산은 Microsoft Store에 게시하는 데 필요합니다.

기본/어두운 테마(필수)

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

밝은 테마(선택 사항)

  • 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