파비콘 생성기

이미지나 글자로 favicon.ico, 앱 아이콘, site.webmanifest를 한 번에 만듭니다. 배경을 투명하게 바꿀 수도 있습니다.

파일을 업로드하지 않습니다 · 모든 처리는 이 브라우저에서 실행

미리보기

체크무늬 = 투명 영역

이미지를 선택하면 여기에 표시됩니다.

My Website

https://example.com

My Website

내려받기

favicon.ico
favicon-16x16.png
favicon-32x32.png
apple-touch-icon.png
android-chrome-192x192.png
android-chrome-512x512.png
site.webmanifest

<head>에 붙여넣을 코드

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">

favicon.ico는 사이트 루트에 두면 브라우저가 자동으로 찾습니다.

자주 묻는 질문

이미지가 서버로 업로드되나요?

아니요. 이미지 읽기, 배경 제거, 크기 조절, ZIP 생성까지 모두 이 브라우저 안에서 처리합니다.

단색 배경 제거는 어떻게 동작하나요?

선택한 색과 비슷한 픽셀을 투명하게 바꿉니다. 기본값은 테두리와 이어진 영역만 지워서, 로고 안쪽의 같은 색은 남깁니다. 허용 오차를 올리면 더 넓은 범위의 색이 지워집니다.

어떤 파일이 만들어지나요?

favicon.ico(16·32·48px), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png(180px), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest가 만들어집니다.

파일은 어디에 두면 되나요?

압축을 풀어 사이트 루트에 두고, 제공되는 코드를 <head> 안에 붙여넣으면 됩니다. favicon.ico는 루트에 있으면 브라우저가 자동으로 찾습니다.