파비콘 크기 설명

16×16 픽셀 파비콘은 원래 웹 표준입니다. 표준(96dpi) 디스플레이의 브라우저 탭, 모든 데스크탑 브라우저의 북마크 도구 모음 및 일부 브라우저 기록 목록에서 사용됩니다. 16×16은 매우 빡빡한 캔버스이므로 파비콘 디자인은 단일 모양, 문자 또는 추상 표시와 같은 가장 간단한 형태로 제거되어야 합니다. 더 복잡한 것은 읽을 수 없습니다.

32×32 픽셀 크기는 16×16의 두 배이며 2배 밀도의 Retina/HiDPI 브라우저 탭, 높은 DPI의 북마크 아이콘 및 Chrome의 주소 표시줄 제안 아이콘을 제공합니다. 고밀도 디스플레이가 대부분의 장치가 되었기 때문에 최신 브라우저는 16×16보다 훨씬 더 자주 32×32를 요구합니다. 한 가지 크기만 배송할 수 있다면 32×32가 가장 효과적인 선택이 될 것입니다.

48×48 픽셀 크기는 Windows Explorer '중간 아이콘' 보기 크기이며 검색 결과 스니펫의 파비콘 자격을 위해 Google 검색에서 요구하는 최소 크기입니다. 파비콘이 최소 48×48 크기를 충족하지 않는 사이트는 Google 검색결과에서 브랜드 마크 대신 일반 지구본 아이콘과 함께 표시됩니다. .ico 번들에는 항상 48×48을 포함하세요.

64×64 픽셀 크기는 Windows Explorer 큰 아이콘 보기 및 일부 Linux 데스크탑 환경에서 사용됩니다. 여러 크기의 .ico 파일에 이를 포함하면 무시할 만한 오버헤드가 추가되지만 파일 관리자 및 셸 환경에서 깔끔한 렌더링이 보장됩니다. 많은 파비콘 생성 도구에는 표준 .ico 번들의 일부로 기본적으로 64개가 포함되어 있습니다.

128×128 픽셀 크기는 Windows Store 앱 타일과 고밀도 작업 표시줄 축소판을 제공합니다. 순수 웹 파비콘에는 덜 일반적으로 필요하지만 사이트가 PWA로 패키지되거나 사용자가 Windows 앱으로 고정하는 경우 중요합니다. PNG 압축을 사용하여 .ico 안에 묶으면 파일 크기가 적당하게 유지됩니다.

256×256 픽셀 크기는 가장 큰 표준 .ico 프레임입니다. Windows 바탕 화면 바로 가기, Windows 시작 메뉴 검색 결과 및 일부 앱 설치 컨텍스트에 사용됩니다. 이 해상도에서는 BMP가 아닌 .ico 컨테이너 내부에서 PNG 압축을 사용해야 합니다. 압축되지 않은 BMP 256×256 이미지는 .ico 파일에 256KB를 불필요하게 추가합니다.

180×180 픽셀 크기는 iOS apple-touch-icon 전용입니다. iPhone 또는 iPad 사용자가 '홈 화면에 추가'를 탭하면 Safari는 `<link rel='apple-touch-icon' size='180x180' href='/apple-touch-icon.png'>`에 선언된 이미지를 가져옵니다. 이 크기는 현재의 모든 iPhone 모델을 포괄합니다(iPhone 6 Plus 이상은 3배 밀도에서 180×180을 사용하고, 이전 모델은 120×120 및 152×152를 사용합니다. 단일 180 파일이 모든 모델을 우아하게 포괄합니다).

192×192 픽셀 크기는 Android Chrome의 PWA 설치 프롬프트에 대한 웹 앱 매니페스트(site.webmanifest)에 필요한 최소 아이콘입니다. 사용자가 Android 홈 화면에 PWA를 추가하면 Chrome는 실행기에 192×192 아이콘을 렌더링하고 최근 앱 전환기에 앱 아이콘을 렌더링합니다. 매니페스트에 이 크기가 없으면 PWA 설치 프롬프트가 일반 아이콘을 표시하거나 전혀 트리거되지 않습니다.

512×512 픽셀 크기는 두 번째 필수 매니페스트 아이콘입니다. Chrome는 홈 화면 실행 후 앱이 로드되는 동안 표시되는 PWA 스플래시 화면과 데스크톱 Chrome OS의 설치 대화 상자 미리 보기에 이를 사용합니다. 또한 모든 작은 변형을 생성하는 데 이상적인 소스 크기입니다. 512×512부터 시작하면 모든 다운샘플링된 출력이 선명한 가장자리와 정확한 색상을 유지할 수 있습니다.

512×512에서 매우 큰 1024×1024 사이의 크기는 주로 웹 파비콘이 아닌 macOS 및 iOS App Store 제출의 기본 앱 아이콘에 사용됩니다. 그러나 래퍼(Electron, Capacitor, Tauri)를 사용하여 웹 사이트를 기본 앱으로 변환하려는 경우 App Store 검토 프로세스에 1024×1024가 필요합니다. 이 마스터 파일을 파비콘 패키지와 함께 저장하세요.

SVG 파비콘은 해상도에 독립적이며 단일 파일로 모든 밀도를 포괄합니다. SVG 파비콘(Chrome 80+, Edge 80+, Firefox 41+, Safari 15+)을 지원하는 브라우저는 1x, 2x, 3x 또는 사용자 정의 DPI로 완벽하게 렌더링되므로 모든 래스터 크기보다 SVG를 선호합니다. 단점은 모든 컨텍스트가 SVG를 지원하는 것은 아니라는 점입니다. Windows 바로가기, RSS 리더 및 이전 도구에는 여전히 .ico 대체가 필요합니다.

크기와 .ico 컨테이너 간의 관계를 이해하는 것이 중요합니다. .ico 파일은 단일 이미지가 아니라 다중 이미지 아카이브입니다. 그 안의 각 프레임은 크기가 다른 별도의 래스터 이미지입니다. 브라우저는 ICO 디렉토리를 읽고 필요한 크기와 가장 일치하는 프레임을 식별한 후 해당 프레임만 디코딩합니다. 이것이 바로 하나의 .ico 파일이 16, 32, 48 및 64픽셀 탭을 동일하게 제공할 수 있는 이유입니다.

2026년 프로덕션 웹사이트에 권장되는 최소 세트는 favicon.ico 16, 32, 48 및 64px 프레임을 번들로 묶는 것입니다. apple-touch-icon.png, 180×180; 안드로이드-크롬-192x192.png; 안드로이드-크롬-512x512.png; 최신 브라우저용 favicon.svg; 192 및 512 PNG를 참조하는 site.webmanifest. favicon generator는 한 번의 클릭으로 단일 소스 업로드를 통해 이 완전한 세트를 생성합니다.

favicon tester를 사용하면 모든 파비콘 크기가 올바르게 제공되는지 확인하는 것이 간단합니다. 사이트 URL을 입력하면 테스터가 favicon.ico 가져오기를 시도하고 HTML 헤드의 링크 태그를 확인한 후 각 크기의 미리보기를 표시합니다. 누락된 크기에는 실행 가능한 권장 사항이 표시됩니다.