이미지를 아이콘과 파비콘으로 변환하기
이미지 한 장을 선택하면 완전한 아이콘 세트를 만들어 드립니다: 여섯 가지 크기를 담은 favicon.ico와 브라우저·운영체제가 요구하는 모든 크기의 PNG 아이콘입니다.
사용 방법
- 1
이미지를 선택하세요 — 투명 배경의 정사각형 PNG가 이상적입니다.
- 2
표시 방식과 원하는 크기를 선택하세요.
- 3
다운로드 전에 모든 크기를 미리 확인하세요.
- 4
favicon.ico만 단독으로 다운로드하거나, PNG 아이콘과 매니페스트가 포함된 전체 패키지를 다운로드하세요.
이미지 하나로는 충분하지 않은 이유
브라우저는 탭에 16, 32픽셀을 원하고, iOS는 홈 화면에 180픽셀을, 안드로이드는 매니페스트에 192, 512픽셀을 원합니다. 큰 이미지 하나만 넘기면 각 기기가 알아서 축소해야 하고, 작은 크기에서는 흐릿해 보이므로 각 크기를 고품질 스무딩으로 개별 렌더링합니다.
ICO 파일이란
여러 크기의 이미지를 하나의 파일에 담아, 시스템이 각 자리에 맞는 것을 골라 쓰는 형식입니다. 16, 32, 48, 64, 128, 256픽셀을 담아 브라우저와 윈도우가 필요로 하는 범위를 모두 채웁니다.
전체 표시 vs 채우고 자르기
아이콘은 정사각형이지만 이미지는 보통 그렇지 않습니다. 전체 표시는 이미지 전체를 유지하고 투명한 여백을 추가하며 로고에 적합합니다. 채우고 자르기는 정사각형을 가득 채우고 가장자리를 잘라내며 사진에 적합합니다.
자주 묻는 질문
- favicon.ico와 PNG 아이콘은 무엇이 다른가요?
- ICO는 여러 크기를 하나로 담고 있으며 구형 브라우저를 포함한 모든 브라우저가 인식합니다. 개별 PNG 아이콘은 iOS, 안드로이드, 웹 매니페스트가 요구하는 것입니다. 전체 패키지는 둘 다 제공합니다.
- 파일은 어디에 두어야 하나요?
- 사이트의 최상위 경로에 두고, 도구 아래에 표시되는 링크 태그를 페이지의 head 안에 추가하세요.
- 좋은 원본 이미지의 조건은 무엇인가요?
- 투명 배경의 512픽셀 이상 정사각형 이미지입니다. 단순한 로고는 정교한 그림보다 16픽셀에서 훨씬 잘 보입니다.
- 투명도가 유지되나요?
- 네. ICO 안팎을 막론하고 모든 크기가 PNG로 생성되며, PNG는 투명도를 완전히 지원합니다.
- SVG도 지원하나요?
- 네, 가장 이상적인 원본입니다 — 각 아이콘 크기에 정확히 맞춰 그려지므로 결과가 매우 선명합니다.
- iOS 아이콘 크기는 얼마인가요?
- 180픽셀이며 apple-touch-icon 태그용입니다. 크기 목록에서 기본으로 선택되어 있습니다.
- 제 이미지가 서버로 업로드되나요?
- 아니요. 생성은 전적으로 브라우저 안에서 이루어지며, ICO 파일 자체도 페이지 안에서 바이트 단위로 조립됩니다.
- site.webmanifest는 무엇인가요?
- 누군가 사이트를 홈 화면에 추가할 때 안드로이드가 어떤 아이콘을 쓸지 알려주는 파일입니다. 패키지 안에 준비된 상태로 생성해 드립니다.