파비콘 생성기

이미지나 로고를 업로드하여 PNG 파비콘, favicon.ico, Apple Touch Icon 후보를 생성합니다.

◴ 데이터 비저장 ⌁ 무료

개념 설명

파비콘은 브라우저 탭·북마크·PWA에서 페이지 아이덴티티를 표시합니다

원본 이미지로 브라우저 탭 아이콘, 북마크 아이콘, PWA 홈 화면 아이콘을 함께 준비하는 용도로 파비콘 세트를 생성합니다.

탭 아이콘은 16~48px 구간에서 가독성이 중요하고, 북마크와 PWA는 보통 180px/192px/512px PNG가 함께 필요합니다.

투명 배경 PNG와 다크모드에서도 판독 가능한 색 대비를 맞춘 뒤, 실제 탭 표시·북마크·모바일 화면에서 동작을 확인해야 합니다.

어디에 쓰나요?

favicon.ico, site.webmanifest, link rel="icon"/"apple-touch-icon" 조합으로 배포할 때, 브라우저 탭, 북마크, 홈 화면 아이콘 시나리오를 한 번에 준비합니다.

권장 크기

일반적으로 16px·32px·48px·180px·192px·512px PNG, ICO, 필요 시 SVG를 함께 생성해 클라이언트·모바일 표시를 보강합니다.

실제 사용 전 확인

투명 배경, 다크모드 가독성, base path 포함 href, 실제 페이지의 title icon 표시 여부를 배포 환경에서 체크리스트로 확인하세요.

파비콘은 '아이콘 미리보기'만이 목적이 아니며, 실제 탭 노출, 북마크, PWA 아이콘까지 한 번에 동작해야 완성됩니다.

파비콘 생성기 파비콘 생성 작업 영역

원본 이미지
파비콘 결과
생성된 파비콘 미리보기가 여기에 표시됩니다.

사용 방법

  1. 1 정사각형에 가까운 이미지를 선택하거나 드롭합니다.
  2. 2 파비콘 생성 버튼을 눌러 여러 PNG 크기와 favicon.ico를 만듭니다.
  3. 3 필요한 파일을 개별 다운로드하거나 ZIP으로 저장하고, 배포 위치에 맞게 HTML 링크 코드의 상대 경로 또는 base path를 확인합니다.

대표적인 사용 사례

  • 파비콘 PNG/ICO 세트 생성
  • 로고 이미지로 파비콘 만들기
  • Apple Touch Icon 후보 제작
  • 파비콘 HTML 링크 코드 준비

자주 묻는 질문

ICO 파일도 생성하나요?

네. V2는 여러 PNG 파비콘 크기와 favicon.ico, HTML 링크 코드를 생성하며 ZIP으로 한 번에 내려받을 수 있습니다. HTML 예시는 상대 경로를 기본으로 제공하므로, 하위 경로에 배포할 때는 href 앞에 base path를 붙이세요. 기본은 브라우저 생성이며, 서버 고품질 생성은 Cloud Run 리사이즈를 사용합니다.

관련 워크플로