파비콘 생성기
로고를 올리면 사이트에 필요한 아이콘을 ZIP 하나로 받을 수 있습니다. 16, 32, 48픽셀이 들어 있는 favicon.ico, Google용 48픽셀 PNG, iPhone용으로 배경이 불투명한 Apple Touch Icon, Android용 192·512픽셀 아이콘, 안전 영역을 계산해 둔 마스커블 아이콘, 그리고 site.webmanifest가 들어 있습니다. SVG를 올리면 icon.svg도 포함됩니다. 탭, Google 검색 결과, 홈 화면 미리 보기를 확인하고 바로 쓸 수 있는 <head> 코드를 복사하세요. 모든 작업은 브라우저 안에서 이루어집니다.
- 무료, 회원가입 불필요
- 파일이 기기 밖으로 나가지 않습니다
- 파일당 최대 50 MB
시작하려면 로고나 아이콘 이미지를 추가하세요. PNG, SVG, JPG, WebP 모두 사용할 수 있으며, 가장 좋은 결과를 얻으려면 512 × 512 픽셀 이상의 정사각형 이미지를 쓰세요.
파일은 기기 밖으로 나가지 않습니다. 이미지는 브라우저 안에서 처리됩니다. 결과물에는 EXIF와 위치 정보가 들어가지 않습니다.
파비콘을 만드는 방법
로고 추가
PNG, SVG, JPG, WebP 로고를 업로드하세요. 가장 좋은 결과를 얻으려면 512 × 512 픽셀 이상의 정사각형 이미지를 쓰세요. SVG도 사용할 수 있습니다.
이름, 색, 여백 설정
사이트 이름과 짧은 이름을 입력하고, 테마 색과 배경색을 고르고, 필요하면 여백을 더하세요. 미리 보기에서 탭, Google, 홈 화면에서 아이콘이 어떻게 보이는지 확인할 수 있습니다.
패키지를 내려받아 배치
ZIP을 내려받아 파일을 사이트의 루트 폴더에 올리고, 표시된 <head> 코드를 페이지에 추가하세요.
무엇이 유지되나요?
유지됨
- 로고의 비율: 정사각형이 아닌 이미지는 정사각형 안에 맞춰지며 늘어나지 않습니다
- 투명도(기본 아이콘에서. 배경색을 고르면 그 색으로 채워집니다)
- SVG를 올리면 icon.svg가 그대로 포함됩니다
달라짐
- 각 아이콘은 고품질로 자기 크기에 맞게 다시 샘플링됩니다
- Apple Touch Icon과 마스커블 아이콘은 항상 배경이 불투명합니다. 고른 색을 쓰고, ‘투명’이면 흰색을 씁니다
- 마스커블 아이콘에서는 내용이 80% 안전 영역 안에 놓입니다
옮겨지지 않음
- PNG나 JPG로는 벡터(SVG)를 만들지 않습니다. icon.svg는 SVG를 입력했을 때만 있습니다
- EXIF 등 메타데이터는 아이콘에 들어가지 않습니다
이럴 때 유용합니다
새 사이트를 위한 완전한 아이콘 세트
favicon.ico 하나만으로는 더 이상 충분하지 않습니다. iPhone 홈 화면, Android, Google 검색 결과가 각각 다른 파일을 요구하기 때문입니다. 한 번 올리면 알맞은 이름과 크기의 파일을 모두 받을 수 있습니다.
Google 검색 결과에 아이콘 표시하기
Google은 한 변이 48픽셀의 배수인 정사각형 파일을 검색 결과의 사이트 아이콘으로 보여 주며, 그 파일은 크롤링이 가능해야 합니다. 패키지에는 해당 파일과 <head> 링크가 들어 있습니다.
앱처럼 추가할 수 있는 웹사이트(PWA)
사이트를 홈 화면에 추가하게 하려면 매니페스트와 192·512픽셀 아이콘이 필요합니다. 마스커블 아이콘이 있으면 Android가 아이콘을 원이나 둥근 사각형으로 잘라도 로고가 잘려 나가지 않습니다.
알아두어야 할 제한
- 가장 좋은 결과를 얻으려면 512 × 512 픽셀 이상의 정사각형 이미지를 쓰세요. 더 작은 원본으로 만든 큰 아이콘은 흐릿해 보입니다.
- 16, 32픽셀 아이콘에서는 가는 선과 작은 글자를 알아보기 어렵습니다. 굵고 대비가 뚜렷한 로고가 더 잘 보입니다.
- 테마 색은 모바일 브라우저의 주소 표시줄에만 적용되며 브라우저 설정에 따라 달라집니다.
- Google 검색 결과의 아이콘이 바뀌기까지 며칠, 길게는 몇 주가 걸릴 수 있고 브라우저도 아이콘을 캐시합니다.
자주 묻는 질문
웹사이트에는 어떤 파비콘 파일이 필요한가요?
요즘 방식은 루트 폴더의 favicon.ico, Google용 48픽셀 PNG, 가능하면 icon.svg, iPhone용 180픽셀 apple-touch-icon.png, Android용 192·512픽셀 아이콘, 그리고 site.webmanifest입니다. 이 생성기가 모두 만들고 <head> 링크도 알려 줍니다.
마스커블 아이콘이란 무엇인가요?
내용을 안전 영역 안에 두고 배경을 빈틈없이 채운 아이콘으로, Android가 기기에 따라 원, 둥근 사각형 등 다양한 모양으로 잘라 쓸 수 있습니다. 여기서는 512픽셀 이미지의 가운데 80% 영역에 내용을 배치합니다.
Apple Touch Icon이 불투명하고 모서리가 각진 이유는 무엇인가요?
iOS는 투명한 부분을 검은색으로 표시하고 모서리는 직접 둥글게 처리하기 때문입니다. 그래서 둥근 모서리 없이, 고른 배경색(투명이면 흰색)으로 빈틈없이 채워 만듭니다.
아이콘이 Google 검색 결과에 나오지 않는 이유는 무엇인가요?
아이콘 파일이 robots.txt로 막혀 있지 않아야 하고, 홈페이지 <head>에서 연결되어 있어야 하며, 한 변이 48픽셀의 배수인 정사각형이어야 합니다. 고친 뒤에는 Search Console에서 홈페이지 색인 생성을 요청할 수 있으나, 반영에는 며칠에서 몇 주가 걸릴 수 있습니다.
정사각형이 아닌 이미지를 올리면 어떻게 되나요?
아이콘이 왜곡 없이 정사각형 안에 맞춰지고 양옆(또는 위아래)에 빈 공간이 생깁니다. 틀을 가득 채우고 싶다면 먼저 자르기 도구로 1:1로 잘라 두세요.
PNG로 SVG 파비콘도 만들어 주나요?
아니요. 픽셀을 자동으로 벡터로 바꾸면 아이콘의 모양이 슬그머니 달라질 수 있어, icon.svg는 직접 SVG를 올렸을 때만 포함됩니다.
이 도구는 무료인가요?
네, 완전히 무료입니다. 계정, 구독, 워터마크가 없습니다.
내 파일이 어딘가에 업로드되나요?
아니요. 이미지는 브라우저 안에서 처리되며 기기 밖으로 나가지 않습니다. 결과물에 EXIF와 위치 정보는 들어가지 않습니다.