ICO 형식은 웹 초기부터 표준 favicon 형식으로 사용되어 왔습니다. 최신 브라우저가 PNG favicon을 지원하지만, 최대 호환성을 위해서는 ICO가 여전히 필수적입니다. 여기서는 PNG를 ICO로 변환하는 다양한 방법을 소개합니다.

2026년에도 ICO가 여전히 중요한 이유

방법 1: 온라인 도구 (가장 쉬움)

가장 간단한 방법은 Mzu favicondl의 Image to Favicon 도구를 사용하는 것입니다.

  1. Tools 페이지로 이동합니다.
  2. PNG 이미지를 업로드합니다.
  3. 이 도구는 모든 favicon 크기(ICO, 16×16, 32×32, 180×180, 192×192, 512×512)를 생성합니다.
  4. 전체 패키지를 ZIP 파일로 다운로드합니다.

보너스: ZIP 파일에는 HTML 코드 스니펫과 site.webmanifest 파일도 포함되어 있습니다. 이는 사이트에 favicon을 추가하는 데 필요한 모든 것입니다.

방법 2: ImageMagick을 사용한 명령줄

터미널을 선호하는 개발자에게 ImageMagick은 표준 도구입니다.

# Install ImageMagick
# macOS: brew install imagemagick
# Ubuntu: sudo apt install imagemagick
# Windows: choco install imagemagick

# Convert PNG to ICO (single size)
magick convert input.png -resize 32x32 favicon.ico

# Create multi-size ICO (recommended)
magick convert input.png -define icon:auto-resize=16,32,48 favicon.ico

다중 크기 접근 방식이 가장 좋습니다. 브라우저가 자동으로 가장 적절한 크기를 선택합니다.

방법 3: FFmpeg 사용

FFmpeg이 이미 설치되어 있다면:

ffmpeg -i input.png -vf scale=32:32 favicon.ico

방법 4: Python 스크립트

Pillow 라이브러리를 사용합니다:

from PIL import Image

img = Image.open('input.png')
img.save('favicon.ico', format='ICO',
         sizes=[(16, 16), (32, 32), (48, 48)])

PNG vs ICO: 언제 사용해야 할까요?

기능PNGICO
최신 브라우저 지원모두모두
레거시 브라우저 지원IE 11+모든 IE 버전
단일 파일 내 다중 크기아니요예
투명도예예
파일 크기크기당 더 작음더 큼 (다중 크기)
Windows 바로 가기아니요예
브라우저 자동 감지HTML에 선언된 경우에만/favicon.ico 자동 감지

모범 사례: 두 가지 모두 사용

권장되는 접근 방식은 두 가지 형식 모두를 제공하는 것입니다.

<!-- ICO as fallback -->
<link rel="icon" type="image/x-icon" href="/favicon.ico">

<!-- PNG for modern browsers (crisper rendering) -->
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">

최신 브라우저는 PNG를 선호합니다. 구형 브라우저와 Windows 바로 가기는 ICO를 사용합니다. 이렇게 하면 두 가지 장점을 모두 얻을 수 있습니다.

최상의 결과를 위한 팁