파비콘을 만드는 방법
현대의 파비콘은 16×16 이미지 그 이상입니다. 모든 브라우저, OS 및 장치에서 선명하게 보이는 설정을 위한 전체 작업 흐름은 다음과 같습니다.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
파비콘이란 무엇입니까?
파비콘은 브라우저의 탭, 북마크바, 기록 목록에 표시되는 작은 아이콘입니다. 모바일에서는 홈 화면 아이콘입니다. Windows에서는 바로가기 아이콘입니다.
최신 사이트는 다양한 해상도와 형식을 제공하므로 모든 표면이 선명한 렌더링을 얻을 수 있습니다.
소스 이미지 준비
최소 512×512 크기의 정사각형 이미지에서 시작하세요. 정사각형 viewBox가 있는 SVG가 이상적입니다. 더 작은 것은 축소되면 흐려집니다.
가는 선과 작은 텍스트를 피하세요. 16×16에서는 사라집니다.
여러 크기의 .ico 생성
단일 favicon.ico 안에 16, 32, 48, 64, 128 및 256을 묶습니다. 브라우저는 자동으로 적절한 크기를 선택합니다.
우리의 파비콘 생성기는 클라이언트 측에서 1초 안에 이 작업을 수행합니다.
HTML 태그 추가
favicon.ico를 사이트 루트에 삭제하세요. 그런 다음 전체 설정을 위해 <head>에 SVG, apple-touch-icon 및 매니페스트 아이콘을 추가하세요.
모든 브라우저에서 확인
Chrome, Safari, Firefox 및 Edge에서 강제 새로 고침. 북마크바, 탭, 홈 화면 설치를 확인하세요.
자주 묻는 질문
What is a favicon?
A favicon is the small icon shown in browser tabs, bookmarks, and mobile home screens. Modern sites ship multiple sizes and formats for crisp rendering everywhere.
What size should my favicon source image be?
Start from a square image at least 512×512 pixels. SVG with a square viewBox works best for sharp downscaling.
Do I need both favicon.ico and PNG files?
Yes — ship a multi-size favicon.ico for universal fallback plus PNGs (180×180 and 192/512) for Apple, Android, and PWAs.
Where do I put favicon files on my website?
Place favicon.ico in your site root and add <link rel="icon"> tags in <head> for SVG and PNG variants.