파비콘 크기 가이드 (2026): 실제로 필요한 파일만
인터넷의 파비콘 체크리스트에는 파일이 스무 개 넘게 나오곤 합니다. 2026년에는 다섯 개 정도면 충분합니다. 모든 최신 브라우저, 구글 검색, iOS 홈 화면, 설치형 웹 앱을 지원하는 최소 세트와 정확한 HTML을 소개합니다.
최소 파비콘 세트
| 파일 | 크기 | 사용처 |
|---|---|---|
favicon.ico | 16, 32, 48px | 오래된 브라우저, /favicon.ico를 자동 요청하는 도구, 윈도우 바로가기 |
favicon-32x32.png | 32px | 브라우저 탭, 북마크 |
favicon.svg (선택) | 벡터 | 최신 브라우저, 다크 모드 대응 가능 |
apple-touch-icon.png | 180px | 아이폰/아이패드 “홈 화면에 추가” |
android-chrome-192x192.png | 192px | 안드로이드 홈 화면, 웹 앱 매니페스트 |
android-chrome-512x512.png | 512px | PWA 시작 화면, 설치 대화상자 |
파비콘 생성기는 이미지 하나로 바로 이 패키지와 site.webmanifest, 복사해 붙여 넣을 HTML 코드를 만들어 줍니다.
HTML 코드
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#ffffff">모든 페이지의 <head>에 넣으세요. 브라우저가 알아서 가장 알맞은 후보를 고르므로 순서가 결정적이진 않지만, ICO를 먼저 두면 오래된 브라우저가 표시하지 못하는 아이콘을 고르는 일을 막을 수 있습니다.
16×16 PNG, 96×96, 144×144는 왜 빼나요?
예전 생성기는 윈도우 타일(msapplication-*), 구형 안드로이드, Opera Coast용으로 수십 개 크기를 만들었습니다. 이 플랫폼들은 사라졌거나 위 파일로 대체합니다. 파일이 늘면 요청과 관리 부담만 커집니다. 16px은 이미 favicon.ico 안에 들어 있습니다.
구글 검색 요건
- 파비콘은 48×48px의 배수(48, 96, 144…) 또는 SVG여야 합니다. ICO 안의 48px이나 192/512px PNG가 조건을 충족합니다.
- Googlebot-Image가 아이콘 파일과 홈페이지를 모두 크롤링할 수 있어야 합니다.
- 아이콘은 브랜드를 나타내고 자주 바뀌지 않아야 합니다 — 부적절한 아이콘은 기본 지구본 아이콘으로 대체될 수 있습니다.
구글이 새 파비콘을 반영하는 데 며칠에서 몇 주가 걸릴 수 있습니다. 문제 해결은 파비콘이 안 보일 때를 참고하세요.
탭에 맞는 디자인
16px에서는 로고가 수십 개의 픽셀로 줄어듭니다. 단순화한 마크(글자 하나나 기호), 강한 대비를 쓰고 글자는 최대한 빼세요. 작은 크기 아이콘 디자인 가이드에 구체적인 방법이 있고, 아이콘 편집기에서는 작업 중에 모든 크기를 실제 크기로 확인할 수 있습니다.
자주 묻는 질문
가장 좋은 파비콘 크기는?
한 가지 크기는 없습니다. 16, 32, 48px이 든 favicon.ico와 180, 192, 512px PNG를 제공하세요. 브라우저가 필요한 것을 고릅니다.
favicon.ico가 아직 필요한가요?
최신 브라우저에 꼭 필요하진 않지만 많은 도구와 크롤러가 /favicon.ico를 자동으로 요청합니다. 하나 두면 404를 막고 오래된 소프트웨어도 지원합니다.