이미지 한 장만 업로드하면 웹사이트에 필요한 모든 파비콘 사이즈를 자동 생성합니다. 정사각형 PNG/SVG를 권장합니다 (512×512 이상).

파비콘 생성기 사용법

  1. 로고 이미지를 업로드합니다 (정사각형 512×512 이상 권장).
  2. 웹·iOS·안드로이드용 사이즈가 자동으로 만들어집니다.
  3. 각 사이즈를 개별 다운로드합니다.
  4. HTML 코드를 복사해 사이트의 <head>에 붙여 넣습니다.

생성되는 사이즈

  • 16×16, 32×32 — 브라우저 탭, 즐겨찾기
  • 48×48 — Windows 사이트 바로가기
  • 64×64, 96×96 — 고해상도 브라우저
  • 180×180 — apple-touch-icon (iOS 홈화면)
  • 192×192 — 안드로이드 Chrome
  • 512×512 — PWA, Android 홈화면

활용 예시

  • 웹사이트 런칭 전 모든 디바이스 대응
  • PWA 매니페스트용 아이콘 세트
  • 로고 변경 시 한 번에 재생성
  • 북마크·홈화면 추가 시 깔끔한 표시

좋은 파비콘 디자인 팁

파비콘은 16×16으로 축소되어도 식별 가능해야 합니다. 로고 전체보다 핵심 심볼(첫 글자, 아이콘)만 사용하고, 가장자리 여백을 충분히 두세요. 색상은 단순하고 대비가 강한 것이 작은 사이즈에서 잘 보입니다.

자주 묻는 질문

이미지가 서버에 저장되나요?

아니요. 모든 변환은 브라우저 Canvas에서 이루어지며 이미지가 외부로 전송되지 않습니다.

왜 favicon.ico가 아닌 PNG로 저장되나요?

모던 브라우저는 모두 PNG 파비콘을 지원하며 ICO보다 화질이 좋습니다. ICO가 필요한 경우(구형 IE 등) PNG를 ICO 변환 사이트에 한 번 더 거치세요. 권장은 SVG 또는 PNG 32×32입니다.

SVG 파비콘이 가장 좋은가요?

네, SVG는 모든 해상도에서 선명하게 표시됩니다. 단, Safari 등 일부 브라우저는 PNG를 더 안정적으로 처리하므로 SVG + PNG 함께 제공하는 것이 가장 안전합니다.

다크모드에서도 잘 보이게 하려면?

SVG 파비콘 안에 @media (prefers-color-scheme: dark) 미디어 쿼리를 사용해 다크모드용 색상을 정의할 수 있습니다.