파비콘 생성기

이미지 한 장으로 favicon.ico·크기별 PNG·apple-touch-icon·manifest를 한 번에 만듭니다. 파일은 기기 밖으로 나가지 않습니다.

이미지 한 장을 끌어다 놓거나 클릭해 선택하세요

<head> 코드

이 도구에 대해

이미지 한 장으로 웹사이트 아이콘 묶음을 만듭니다. 브라우저 탭에 쓰는 favicon.ico(16·32·48 크기를 한 파일에 담음), 크기별 PNG, 아이폰 홈 화면용 apple-touch-icon, 안드로이드용 아이콘과 마스커블 아이콘, site.webmanifest를 한 번에 만들어 ZIP으로 묶습니다.

사이트의 <head>에 붙여 넣을 코드도 함께 만들어 주므로, 파일을 올리고 코드를 붙이면 끝납니다. 실제 크기로 어떻게 보이는지 확인하면서 배경색·안여백·둥근 모서리를 조절할 수 있습니다.

사용 방법

아이콘으로 쓸 이미지 한 장을 끌어다 놓거나 눌러서 고릅니다. 정사각형이 아니어도 됩니다.
끌어서 위치를 맞추고 확대해 아이콘에 담을 부분을 정합니다.
배경을 투명하게 둘지 색으로 채울지 고르고, 안여백과 둥근 모서리를 조절합니다. 16픽셀 미리보기에서도 알아볼 수 있는지 확인하세요.
「ZIP 내려받기」로 파일을 받아 사이트에 올리고, 화면에 나온 <head> 코드를 복사해 붙여 넣습니다.

자주 묻는 질문

ZIP에는 어떤 파일이 들어 있나요?

favicon.ico, favicon-16x16·32x32·48x48·96x96.png, apple-touch-icon.png(180), icon-192.png, icon-512.png, icon-maskable-512.png, site.webmanifest, 그리고 <head>에 붙일 코드가 담긴 head-snippet.html입니다.

마스커블 안전영역이 무엇인가요?

안드로이드는 기기마다 아이콘을 원·둥근 사각형 같은 여러 모양으로 잘라 씁니다. 마스커블 아이콘은 어떻게 잘려도 중요한 부분이 남도록 가운데에 여유를 둔 아이콘이고, 안전영역 표시를 켜면 잘리지 않는 범위를 화면에서 확인할 수 있습니다.

둥근 모서리를 켜야 하나요?

보통은 꺼 두는 편이 낫습니다. iOS와 안드로이드는 홈 화면에서 아이콘 모서리를 알아서 깎기 때문에, 미리 깎아 두면 모서리가 이중으로 둥글어질 수 있습니다.

파일이 서버로 올라가나요?

아니요. 변환은 모두 지금 쓰고 있는 브라우저 안에서 합니다. 파일을 어디로도 보내지 않으므로 사진이나 문서가 다른 곳에 남을 걱정이 없습니다.

무료인가요? 가입해야 하나요?

무료이고 가입이나 로그인도 필요 없습니다. 페이지를 열면 바로 쓸 수 있습니다.