파비콘 패키지 생성기

이미지 한 장을 브라우저에서 PNG, 웹 매니페스트, head HTML 스니펫을 갖춘 멀티플랫폼 파비콘 패키지로 만들어 줍니다.

도구를 불러오는 중…

파비콘 패키지 생성기 — PNG, JPG, SVG, WebP 이미지 한 장을 올리면 파비콘 패키지가 한 번에 완성됩니다: 16, 32, 48, 180(Apple touch), 192, 512 px(Android/PWA) 정사각형 PNG 아이콘에, 그대로 붙여 넣을 수 있는 site.webmanifest와 이들을 모두 연결하는 head 섹션용 HTML 스니펫까지 함께 제공됩니다. 각 크기는 고품질 캔버스 스케일링으로 생성되며 개별로 받거나 패키지로 한 번에 받을 수 있습니다. 모든 처리는 브라우저 안에서만 이뤄지며 이미지는 절대 업로드되지 않습니다.

파비콘 패키지 생성기란?

Favicon Package Generator는 소스 이미지 한 장으로 현대 웹사이트에 필요한 모든 파비콘 파일을 만들어 주는 무료 브라우저 기반 도구입니다. 소프트웨어 설치나 회원가입 없이 HTML, WordPress, PWA, Apple 기기용으로 바로 쓸 수 있는 아이콘 세트가 필요한 웹 개발자, 디자이너, 사이트 운영자를 위해 만들어졌습니다. 이미지를 한 장 드롭하면 16, 32, 48 px 표준 파비콘, 180 px Apple touch 아이콘, 192·512 px Android/PWA 아이콘을 렌더링하고, 짝이 맞는 site.webmanifest와 link·meta 태그를 모은 head 섹션용 복사용 스니펫을 생성합니다. 로고를 전적으로 내 기기 안에서 바로 배포할 수 있는 파비콘 파일로 묶고 싶을 때 언제든 사용하세요.

파비콘 패키지 생성기 사용법

  1. PNG, JPG, SVG, WebP 이미지를 드롭존에 끌어다 놓거나, 클릭해서 기기에서 파일을 찾아 선택하세요.
  2. 도구가 여섯 가지 정사각형 크기를 자동으로 렌더링하는 동안 기다리세요. 소스 이미지와 생성된 각 아이콘의 미리보기가 아래에 표시됩니다.
  3. 소스 이미지나 아이콘 썸네일을 클릭하면 확대 라이트박스가 열려 해당 픽셀 크기에서 어떻게 보이는지 확인할 수 있습니다.
  4. 크기별 다운로드 버튼을 눌러 아이콘 하나만 저장하세요. 예를 들어 32 px 파비콘이나 512 px PWA 아이콘만 받을 수 있습니다.
  5. site.webmanifest와 <head> HTML 스니펫을 복사해 아이콘을 사이트에 연결하고, 프로젝트에 붙여 넣으세요.
  6. 패키지 다운로드를 클릭하면 모든 PNG와 site.webmanifest 파일을 한 번에 저장합니다.

예시

로고를 완전한 파비콘 패키지로

정사각형 PNG 로고를 드롭하면 favicon-16x16.png, favicon-32x32.png, favicon-48x48.png, apple-touch-icon.png, android-chrome-192x192.png, android-chrome-512x512.png를 받아 site.webmanifest와 함께 public 폴더에 넣을 수 있습니다.

HTML head에 연결하기

생성된 link·manifest 태그 <head> 스니펫을 복사해 페이지의 <head> 태그 사이에 붙여 넣으면 브라우저와 PWA가 상황에 맞는 아이콘을 골라 씁니다.

Apple과 PWA 아이콘만 받기

패키지를 렌더링한 뒤, 전체를 받는 대신 180 px Apple touch 아이콘과 192·512 px Android/PWA 아이콘만 개별로 다운로드하세요.

자주 묻는 질문

어떤 파일을 생성하나요?
정사각형 PNG 아이콘 여섯 개(16, 32, 48, 180, 192, 512 px), site.webmanifest 매니페스트, 그리고 이들을 연결하는 복사용 <head> HTML 스니펫을 생성합니다. 각 PNG는 개별로 받거나 패키지로 한 번에 받을 수 있습니다.
어떤 이미지 형식을 업로드할 수 있나요?
PNG, JPG, SVG, WebP 이미지 한 장을 드롭하거나 찾아서 선택할 수 있습니다. 도구는 그 한 장의 소스 이미지를 읽어 모든 출력 크기를 렌더링합니다.
아이콘은 PNG 파일인가요, ICO 파일인가요?
생성되는 모든 아이콘은 PNG입니다. 이 도구는 하나로 합친 ICO 파일이 아니라 크기별로 개별 정사각형 PNG 파일을 만들며, 이는 현대 브라우저와 PWA가 기대하는 형식입니다.
정사각형이 아닌 이미지는 늘어나나요?
아니요. 각 크기는 원본 가로세로 비율을 유지하며, 고품질 canvas 스케일링으로 정사각형 가운데에 배치되고 남는 공간은 투명 여백으로 채워집니다.
제 이미지가 서버로 업로드되나요?
아니요. 모든 처리는 Canvas API를 사용해 브라우저 안에서 로컬로 실행됩니다. 이미지가 업로드되는 일은 결코 없으므로 내 기기 안에서 완전히 비공개로 유지됩니다.

관련 도구

코드 이미지 변환기

코드 스니펫을 브라우저 안에서 구문 강조가 입혀진 깔끔한 PNG 이미지로 바꿔 줍니다. 업로드는 필요 없습니다.

색상 대비 검사기

전경색과 배경색의 WCAG 대비비를 확인하고 일반 텍스트와 큰 텍스트에서 AA와 AAA를 통과하는지 보여 줍니다.

색상 혼합기

두 HEX 색을 원하는 비율로 RGB 또는 Lab 색공간에서 섞어, 만들어진 중간 색을 견본과 복사 가능한 HEX 값으로 보여줍니다.

색상 셰이드 생성기

기준 HEX 색 하나를 Tailwind 방식의 50~950 셰이드 스케일로 만들고 각 단계를 색 견본과 복사 가능한 HEX 값으로 보여줍니다.