파비콘 생성기

파비콘 생성기란?

파비콘(favicon)은 브라우저 탭, 즐겨찾기, 검색 결과, 휴대폰 홈 화면에 표시되는 웹사이트의 작은 아이콘입니다. 파비콘이 없으면 탭에 빈 아이콘이 보여 사이트가 미완성처럼 보이고, 구글 검색 결과에서도 기본 지구본 아이콘이 표시됩니다.

이 도구는 로고 이미지나 글자·이모지 하나로 모든 기기에 필요한 크기의 파비콘 세트를 만들어 줍니다. 16px처럼 아주 작은 크기는 큰 이미지를 줄이지 않고 그 크기에서 직접 그려 더 선명합니다. 모든 작업은 브라우저 안에서 이루어집니다.

사용 방법

1. 글자·이모지 또는 이미지를 고르세요. 글자는 1~2자, 이미지는 정사각형 로고가 가장 잘 어울립니다.
2. 배경 색(또는 투명), 모서리 둥글기, 안쪽 여백을 조절하세요. 오른쪽(모바일은 아래) 미리보기에서 실제 탭 크기로 확인할 수 있습니다.
3. 전체 다운로드 (ZIP)를 눌러 파일 세트를 받고, 압축을 풀어 웹사이트 최상위 폴더에 올리세요.
4. 아래 HTML 코드를 복사해 모든 페이지의 <head> 안에 붙여 넣으세요.

ZIP에 들어 있는 파일

아이폰 홈 화면 아이콘은 투명 배경을 지원하지 않아 검게 보이므로, 투명을 선택해도 apple-touch-icon.png만 흰 배경으로 저장합니다.

작은 크기에서도 잘 보이는 파비콘 만들기

• 16px 탭 아이콘에서는 가는 선과 작은 글자가 뭉개집니다. 로고 전체보다 심볼이나 첫 글자 하나가 더 잘 보입니다.
• 배경과 글자의 명도 차이를 크게 하세요. 다크 모드 탭에서도 보이도록 투명 배경보다 색 배경이 안전합니다.
• 파비콘을 바꿨는데 그대로 보이면 브라우저 캐시 때문입니다. 강력 새로고침(Ctrl+Shift+R)을 하거나 파일 이름 뒤에 ?v=2를 붙이세요.